h5动态必填需用js实时控制required布尔属性，须满足：表单包裹、原生提交、无novalidate；监听条件变化（非值变化），用required=true/false赋值；表格场景推荐事件委托精准定位。
在 H5 原生表单中实现“动态必填/选填”，核心是用 JavaScript 实时控制 input 或 select 元素的 required 布尔属性，而不是靠 HTML 静态写死。浏览器对 required = true/false 的响应是即时的——DOM 属性一变，提交校验状态立刻更新，且与原生提示（如点击提交时弹出“请填写此字段”）完全兼容。
关键前提：确保原生校验能生效
动态 required 要起作用，必须满足三个硬性条件：
-
<input>必须包裹在<form></form>标签内（不能只是视觉上在表单区域） - 提交必须走原生路径：用
<button type="submit"></button>或回车触发，不能event.preventDefault()后手动调form.submit() -
<form></form>不能带novalidate属性
监听条件变化，而非值变化
重点不是“用户输没输”，而是“触发条件是否成立”。例如：
- 另一个字段有输入（
name.value.trim() !== ''） - 下拉框选中了特定值（
status.value === 'Reject'） - 复选框被勾选（
checkbox.checked === true）
推荐用 addEventListener('change') 或 'input' 监听这些“条件字段”，在回调里统一判断并设置目标字段的 required 状态。
正确操作 required 属性
直接赋布尔值，不要用 setAttribute：
- ✅ 正确：
targetInput.required = true或targetInput.required = false - ❌ 错误：
targetInput.setAttribute('required', '')—— 这会把值设成空字符串，浏览器仍视为true
这样写语义清晰、行为确定，且兼容所有现代 H5 浏览器。
表格多行场景：精准定位当前行
如果是在表格中（比如每行一个审批状态 + 一个评论框），不能全局找元素。错误做法是循环绑定所有 select；新增行后新元素无监听器。
推荐用事件委托：
- 给
<tbody> 绑 <code>change事件 - 用
event.target.closest('tr')拿到当前行 DOM - 再用
row.querySelector('input[data-field="comment"]')找同行的输入框 - 根据
event.target.value判断是否为"Reject"或"Discuss"，再设commentInput.required
