正则表达式输入框验证

说明

 1 onkeyup”=按键抬起触发,“onafterpaste”=粘贴之后触发,整体的意思是用于限制
 2 
 3 \D:类似[^0-9] 非数字
 4 /g：全局
 5 this.value=this.value.replace(/\D/g,'') :把所有非数字的替换成空
 6 
 7 img 是模式，为可选参数
 8 i 忽略大小写
 9 m 多行模式
10 g 全局模式
11 
12 \D等价于[^0-9]
13 \w等价于[A-Za-z_0-9]
14 \W等价于[^A-Za-z_0-9]
15 
16 ?等价于匹配长度{0,1}
17 *等价于匹配长度{0,}
18 +等价于匹配长度{1,}
19 \d等价于[0-9]

html:

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8 
 9 只能输入正整数(小数点也不能输入)：<input type="text" placeholder="只能输入数字" onkeyup="this.value=this.value.replace(/\D/g,'')"
10                          onafterpaste="this.value=this.value.replace(/\D/g,'')"><br>
11 只能输入字母：<input type="text" placeholder="只能输入字母" onkeyup="value=value.replace(/[^A-Za-z]/ig,'')"><br>
12 只能输入汉字：<input type="text" placeholder="只能输入汉字" onkeyup="value=value.replace(/[^[\u4e00-\u9fa5]*/ig,'')"><br>
13 
14 只能输入数字和字母(不能输入符号)：<input type="text" placeholder="只能输入数字和字母" onkeyup="value=value.replace(/[^A-Za-z0-9]/ig,'')"><br>
15 只能输入数字和汉字：<input type="text" placeholder="只能输入数字和汉字" onkeyup="value=value.replace(/[^0-9\u4e00-\u9fa5]/g,'')"><br>
16 只能输入字母和汉字：<input type="text" placeholder="只能输入字母和汉字" onkeyup="value=value.replace(/[^A-Za-z\u4e00-\u9fa5]/g,'')"><br>
17 
18 只能输入非零的正整数：<input type="text" placeholder="只能输入非零的正整数"
19                   onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}"><br>
20 </body>
21 <script>
22     //只能输入大于或等于0的数，或者是小数
23     function IsIntegerOrDecimal(id) {
24         var str = document.getElementById(id).value.trim();
25         if (str.length != 0) {
26             var reg = /^[1-9]\d*(\.[0-9]+)?|0(\.[0-9]+)?$/;
27             if (!reg.test(str)) {
28                 return false;
29             } else {
30                 return true;
31             }
32         }
33     }
34 </script>
35 </html>

正则表达式输入框验证

猜你喜欢