在项目中经常遇到需要验证输入内容的情况,可以通过 Javascript 判断输入内容,验证手机号或者是否为汉字。
简单的记录一下:
HTML部分:
<input type="text" name="name" id="name" placeholder="请输入您的姓名" value=""/> <input type="number" name="mobile" id="mobile" placeholder="请输入您的手机号" value=""> <button id="button">提交</button>
js 部分:
首先获取到元素:
var uname = document.getElementById("name"); var umobile = document.getElementById("mobile"); var ubutton = document.getElementById("button");
判断用户名是否为空:
if(uname.value == ""){ alert("请输入姓名!"); }
验证输入的是否是汉字:
var han = /^[\u4e00-\u9fa5]{2,9}$/; //设置汉字的正则表达式:2-9个汉字 if(!han.test(uname.value)){ //验证输入的内容是否是2-9个汉字 alert("请输入汉字,不少于2个!"); }
验证手机号:
var myreg=/^[1][3,4,5,7,8][0-9]{9}$/; //设置手机号正则表达式 if(!myreg.test(umobile.value)){ //验证手机号格式是否正确 alert("手机号格式不正确!"); }
拓展:JavaScript test() 方法
test() 方法用于检测一个字符串是否匹配某个模式。
如果字符串中有匹配的值返回 true ,否则返回 false。
语法:
RegExpObject.test(string)
RegExpObject 验证规则。
string 要检测的字符串。
实例:在字符串中全局搜索 "Hello" 和 "Runoob" 字符串:
var str="Hello world!"; //查找"Hello" var patt=/Hello/g; var result=patt.test(str); document.write("返回值: " + result); //查找 "w3h5" patt=/w3h5/g; result=patt.test(str); document.write("<br>返回值: " + result);
以上实例输出结果:
返回值: true 返回值: false
未经允许不得转载:前端资源网 - w3h5 » js 获取input的value值及验证手机号和汉字的正则表达式