逐项表单验证与错误关联 | 星雨笔录

关联错误信息与对应输入控件。

核心: 逐项验证时让错误消息与控件关联,并将焦点放到第一个错误字段。

最小示例:

const input = document.querySelector('#name');
const error = document.querySelector('#nameError');
input.setAttribute('aria-describedby', 'nameError');
if (!input.value.trim()) { error.textContent = '请输入姓名'; input.focus(); }

学完能做: 关联错误信息与对应输入控件。