必须用 oninput 实时过滤,因其覆盖粘贴、拖入、ime 输入等所有途径,ie10+ 全兼容;onkeypress/onkeydown 无法拦截粘贴和中文上屏,keycode 不稳定;正则需按业务明确定义允许字符,赋值 this.value 是关键。

必须用 oninput 实时过滤,lay-verify 只管提交校验,拦不住输入过程中的粘贴、拖入和中文输入法上屏。
为什么不能用 onkeypress 或 onkeydown
它们无法拦截粘贴(Ctrl+V)、拖入文本、IME 输入(比如拼音打字中途的「·」或「——」),且 keyCode 在不同键盘布局和输入法下不稳定。中文用户输「。」、「【】」、「《》」时,这些字符根本不会触发 keydown,但会直接进到输入框里。
-
oninput触发时机晚于内容实际写入 DOM,覆盖所有输入途径,IE10+ 全兼容 - 别信“加个
pattern属性就能拦”的说法,pattern只影响表单验证提示,不阻止输入 - 动态生成的 input(如表格行内编辑)必须等 DOM 存在后再绑定,否则事件无效
正则怎么写才不误伤合法内容
所谓“特殊字符”没有统一定义,得按业务明确允许范围。粗暴用 /[^\w\s]/g 会把中文标点全干掉,而用户地址、备注、姓名里常见「·」、「—」、「《》」、「【】」。
- 只允许字母、数字、中文、空格:
/[^a-zA-Z0-9\u4e00-\u9fa5\s]/g - 若需保留中文标点,显式加进去:
/[^\u4e00-\u9fa5a-zA-Z0-9,。!?;:""''()【】《》、\s]/g - 防 SQL 注入?别在前端筛
'、;、--,这些在昵称、地址里完全合法;后端必须用参数化查询,前端筛只是体验层补丁 - HTML 危险字符(
、<code>>、&、"、')可单独处理:.replace(/[&"']/g, ''),别一股脑全删
赋值回 this.value 是关键一步
只调 replace() 不赋值,等于白写。Layui 不会自动同步 value,也不重绘光标位置,漏掉赋值会导致 UI 和实际值错位。
- 必须写成:
this.value = this.value.replace(/.../g, '') - 如果 input 是动态插入(如弹窗、表格 edit),要在
table.on('edit')回调里重新绑定oninput - 移动端输入法上屏前可能触发多次
oninput,只要正则逻辑稳定,不影响最终结果 - 别依赖
form.render()来“刷新”这个逻辑——它不干预 input 的 value,只重绘样式和交互状态
真正容易被忽略的是:正则范围一旦定错,轻则用户反复输不进名字里的「·」,重则地址栏删掉「—」导致门牌号变成“123456789”,而这种问题上线后才暴露,比功能缺失更难排查。











