左边是带校验属性的表单,直接点提交看浏览器的原生提示;右边是「绕过原生提示、自己接管」的版本。
pattern 是「整串匹配」:外层已隐含 ^(…)$,不要再自己加 ^ 和 $。配合 title,浏览器提示会说清规则。
| 属性 | 拦住的输入 |
|---|---|
required | 空值 |
type=email/url | 格式不符 |
min/max/step | 越界、非步长倍数 |
minlength/maxlength | 长度不符 |
pattern | 正则不匹配 |
accept | 文件类型不符 |
原生校验只是「第一道劝退」,永远不能替代服务端校验:关掉 JS 或用 curl 就能绕过全部限制。