在線測試效果及查看源碼
部分在線測試用例
只能輸入數(shù)字
<input onblur="value = value.replace(/[^0-9]/g,'')">
只能輸入數(shù)字和小數(shù)點(diǎn)
<input onblur="value = value.replace(/[^\0-9\.]/g,'')">
只能輸入英文
<input onblur="value = value.replace(/[^\a-\z\A-\Z0-9]/g,'')">
只能輸入中文
<input onblur="value = value.replace(/[^\u4E00-\u9FA5]/g,'')">
只能輸入中文、英文和數(shù)字
<input onblur="value = value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,'')">
只能輸入中文蠢古、英文、數(shù)字和空格
<input onblur="value = value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5\ ]/g,'')">
只能輸入英文和特殊字符
// 特殊字符暫定為：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)
<input onblur="value = value.replace(/[^\a-\z\A-\Z0-9\u0020-\u007F]/g,'')">
將輸入的字母變?yōu)榇髮?/h2>
<input onkeyup="value = value.toUpperCase()">
總結(jié)
方法
-
onblur 在輸入框失去焦點(diǎn)的時(shí)候觸發(fā)事件
-
onkeyup 在鍵盤輸入的時(shí)候觸發(fā)事件
規(guī)律
<input onkeyup="value = value.toUpperCase()">
onblur 在輸入框失去焦點(diǎn)的時(shí)候觸發(fā)事件onkeyup 在鍵盤輸入的時(shí)候觸發(fā)事件通過以上一個(gè)例子萤晴，我們可以清晰地發(fā)現(xiàn)互艾，限制input輸入框的內(nèi)容载碌，實(shí)際上就是控制value.replace(xxx,'')中xxx的正則表達(dá)式.
比如猜嘱，我們實(shí)現(xiàn)用戶只能輸入中文且包含孤僻字的需求。
step1: 查詢需要的漢字碼表
| 區(qū)塊 | 范圍 | 實(shí)際漢字個(gè)數(shù)/備注 | 正則式 |
|---|---|---|---|
| CJK統(tǒng)一漢字 | 4E00-62FF, 6300-77FF,7800-8CFF, 8D00-9FFF. | 20,971/常見 | [\u4E00-\u9FFF] 或[一-?] |
| CJK統(tǒng)一漢字?jǐn)U展A區(qū) | 3400-4DBF. | 6,582/罕見 | [\u3400-\u4DBF] |
| CJK統(tǒng)一漢字?jǐn)U展B區(qū) | 20000-215FF, 21600-230FF,23100-245FF, 24600-260FF,26100-275FF, 27600-290FF,29100-2A6DF. | 42,711/罕見嫁艇，歷史 | [\U00020000-\U0002A6DF] |
| CJK統(tǒng)一漢字?jǐn)U展C區(qū) | 2A700-2B73F. | 4,149/罕見朗伶，歷史 | [\U0002A700-\U0002B73F] |
| CJK統(tǒng)一漢字?jǐn)U展D區(qū) | 2B740–2B81F. | 222/不常見，仍在使用 | [\U0002B740-\U0002B81F] |
| CJK統(tǒng)一漢字?jǐn)U展E區(qū) | 2B820–2CEAF. | 5,762/罕見步咪，歷史 | [\U0002B820-\U0002CEAF] |
| CJK統(tǒng)一漢字?jǐn)U展F區(qū) | 2CEB0-2EBEF. | 7,473/罕見论皆，歷史 | [\U0002CEB0-\U0002EBEF] |
| CJK兼容漢字 | F900–FAFF. | 472/重復(fù)、可統(tǒng)一變體歧斟、公司定義 | [\uF900-\uFAFF] |
| CJK兼容漢字增補(bǔ) | 2F800-2FA1F. | 542/可統(tǒng)一變體 | [\U0002F800-\U0002FA1F] |
step2:先匹配常用中文
// 常用中文（不包含孤僻字）
<input onblur="value = value.replace(/[^\u4E00-\u9FFF]/g'')">
step3: 在正則后面拼接你所需要的孤僻字正則表達(dá)式
比如我們需要CJK統(tǒng)一漢字?jǐn)U展A區(qū)的孤僻字纯丸，我們在后面拼接\u3400-\u4DBF即可偏形。
<input onblur="value = value.replace(/[^\u4E00-\u9FFF\u3400-\u4DBF]/g,'')">
