input 只能输入英文和特殊字符和孤僻字

在线测试效果及查看源码

部分在线测试用例

只能输入数字


只能输入数字和小数点


只能输入英文


只能输入中文


只能输入中文、英文和数字


只能输入中文、英文、数字和空格


只能输入英文和特殊字符

// 特殊字符暂定为:Unicode字符列表中的基本拉丁字符(u0020-u007F)可以配置
// [Unicode字符列表](https://zh.wikipedia.org/w/index.php?title=Unicode%E5%AD%97%E7%AC%A6%E5%88%97%E8%A1%A8) 

将输入的字母变为大写


总结

方法

  • onblur 在输入框失去焦点的时候触发事件
  • onkeyup 在键盘输入的时候触发事件

规律

通过以上一个例子,我们可以清晰地发现,限制input输入框的内容,实际上就是控制value.replace(xxx,'')中xxx的正则表达式.
比如,我们实现用户只能输入中文且包含孤僻字的需求。

step1: 查询需要的汉字码表

区块 范围 实际汉字个数/备注 正则式
CJK统一汉字 4E00-62FF, 6300-77FF,7800-8CFF, 8D00-9FFF. 20,971/常见 [\u4E00-\u9FFF] 或[一-鿆]
CJK统一汉字扩展A区 3400-4DBF. 6,582/罕见 [\u3400-\u4DBF]
CJK统一汉字扩展B区 20000-215FF, 21600-230FF,23100-245FF, 24600-260FF,26100-275FF, 27600-290FF,29100-2A6DF. 42,711/罕见,历史 [\U00020000-\U0002A6DF]
CJK统一汉字扩展C区 2A700-2B73F. 4,149/罕见,历史 [\U0002A700-\U0002B73F]
CJK统一汉字扩展D区 2B740–2B81F. 222/不常见,仍在使用 [\U0002B740-\U0002B81F]
CJK统一汉字扩展E区 2B820–2CEAF. 5,762/罕见,历史 [\U0002B820-\U0002CEAF]
CJK统一汉字扩展F区 2CEB0-2EBEF. 7,473/罕见,历史 [\U0002CEB0-\U0002EBEF]
CJK兼容汉字 F900–FAFF. 472/重复、可统一变体、公司定义 [\uF900-\uFAFF]
CJK兼容汉字增补 2F800-2FA1F. 542/可统一变体 [\U0002F800-\U0002FA1F]

step2:先匹配常用中文

// 常用中文(不包含孤僻字)

step3: 在正则后面拼接你所需要的孤僻字正则表达式

比如我们需要CJK统一汉字扩展A区的孤僻字,我们在后面拼接\u3400-\u4DBF即可。


你可能感兴趣的:(input 只能输入英文和特殊字符和孤僻字)