提交按钮在表单填全前一直是灰的,用户觉得都填完了按钮还是点不动,来回翻也看不出到底少了什么。第一次遇到会往复杂处想,其实漏掉的多是个小前提。

<button aria-disabled='true'
        aria-describedby='miss'>提交</button>
<p id='miss'>还缺:发票抬头</p>

按钮的禁用条件藏在脚本里,界面上没有说明还差哪几项,用户只能靠猜,读屏也拿不到任何不能点的理由,试到最后干脆放弃。这一点先确认清楚,后面就不用反复试。

「禁用提交按钮反馈」这类改动最怕改一半,回滚脚本先准备好,再动生产。把这次用到的命令存进笔记,比记住结论有用,换个环境还能照着走。

改完隔一天再看一次,当场正常不代表能稳住。测试环境和线上的差别,往往就在版本号和那几行被忽略的配置上。

具体做法是,把还缺的字段写在按钮附近并随输入实时更新;或者干脆改成可点提交,再由校验给出具体的原因;确实要禁用就用 aria-disabled,让按钮仍能被聚焦并读出状态。

改完照着核一遍,清空其中一项再回来看,按钮附近就能直接说清缺的是哪一项。

作者 9823189