chrome 10+、firefox 4+、edge 12+、opera 15+原生支持required并正确拦截提交；safari 10.1+支持文本类输入，但date/number等控件校验可能失效；ie10–11支持input/textarea，select不生效。
required 属性在现代浏览器中基本可用，但 IE9 及更早版本完全不识别它，Safari 12.1 之前对 input[type="date"] 和 input[type="email"] 的 required 校验存在静默失效问题——它会标记为无效，却不触发默认提示，也不阻止提交。
哪些浏览器真能用 required？
Chrome 10+、Firefox 4+、Edge 12+、Opera 15+ 均原生支持 required 并正确拦截表单提交；Safari 10.1+ 对文本类输入（type="text"、type="email"）支持完整，但对 type="date"、type="number" 等控件仍可能跳过校验逻辑；IE10–IE11 支持 required，但仅限于 input 和 textarea，对 select 不生效（即使写了 required，空选项仍可提交）。
required 失效时的典型现象
用户点击提交后页面直接刷新或跳转，没有弹出“请填写此字段”提示；input.checkValidity() 返回 false，但 form.reportValidity() 不触发 UI 提示；控制台无报错，DOM 中该元素的 validity.valid 为 false，但事件未被拦截。
- IE9 及以下：
required被完全忽略，属性存在但无任何行为 - Safari ≤12.0：
required在type="date"上不触发校验，用户可提交空值 - Firefox 某些版本（如 68）：当
input被动态插入 DOM 后再设required，校验不自动激活，需手动调用input.checkValidity()
如何安全降级而不写两套逻辑
不要删掉 required，而是叠加轻量 JS 检测——利用浏览器自身校验结果，只补足缺失环节：
- 监听
submit事件，调用form.checkValidity()，若返回false则event.preventDefault() - 对 IE9 及更早版本，额外遍历所有带
required的元素，检查value.trim() === ''或selectedIndex === 0（针对select） - 避免重写
reportValidity()的 UI，优先复用浏览器原生提示；仅当必须定制样式时，才用setCustomValidity('')清空后手动添加错误消息 - 注意：不要在
blur或input事件里提前校验required字段，容易误报（比如用户刚点进去还没输）
服务端永远要验证 required 字段
前端 required 本质是体验层优化，不是安全边界。哪怕你做了完整降级，仍可能出现 JS 被禁用、网络中断导致脚本未加载、或用户绕过表单直接发请求等情况。所以后端收到数据后，必须独立判断该字段是否为空字符串、null 或缺失，且错误响应要明确返回字段名和错误类型，方便前端映射回对应输入框。
最容易被忽略的是 select 的空选项处理：很多开发者只给第一个 option 设 value=""，却忘了加 disabled selected，导致用户没选时实际提交的是空字符串而非未选状态——这会让 required 在部分浏览器里“以为已填”，而服务端又无法区分这是用户故意选空还是未操作。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
