js正则表达式进行格式校验
来源:互联网 发布:淘宝实时访客其他来源 编辑:程序博客网 时间:2024/05/16 09:18
今天做了个js正则表达式的练习,利用正则表达式进行注册信息格式验证,注册信息界面如下:
格式要求:
1、学号项不能为空,必须为纯数字,不能与数据库中的重复,正则表达式/^\d+$/g;
2、姓名项不能为空;
3、密码不能为空且无空格判断空格text.split(" ").length != 1,安全等级分为3个等级,若全为字母或者数字为1级,正则表达式(text.search(/^[a-zA-Z]+$/g) != -1) || (text.search(/^[0-9]+$/g) != -1,若只有有标点符号或标点与字母或者数字同时出现则为2级,正则表达式text.search(/^[a-zA-Z0-9]+$/g) != -1,若字母、数字和标点同时出现则为3级;
4、确认密码项要求与密码项填写的密码一致;
5、年级项不能为空,且格式必须为第20**级,正则表达式text.search(/^\u7B2C{1}20\d+\u7EA7{1}$/) != -1;
6、专业项不能为空,且只能以汉字开头,结尾可以为汉字或者字母正则表达式text.search(/^[\u4e00-\u9fa5]+[a-zA-Z]*$/g) != -1;
7、班级项不能为空且格式为专业+班级即类似电信1001格,正则表达式text.search(/^[\u4e00-\u9fa5]+\d{4}$/) != -1;
8、手机项可以为空,格式为(+86)1*********正则表达式text.search(/^(\+86)?1\d{10}$/) != -1。
运行效果:
正确格式输入后运行效果:
html代码:
<!--register--><div style="display:block"><div><span style=" font-weight: bold;"><label>注册</label></span></div><div><span class="input_span"><label class="text_label">学号</label><label class="text_label" style="color:Red;">*</label></span><span class="input_span"><input type="text" id="studentNum_input" onblur="checkRegisterInfo(1)"/></span><span><label id="studentNumCheck_label"></label></span></div><div><span class="input_span"><label class="text_label">姓名</label><label class="text_label" style="color:Red;">*</label></span><span class="input_span"><input type="text" id="name_input" onblur="checkRegisterInfo(2)"/></span><span><label id="nameCheck_label"></label></span></div><div><span class="input_span"><label class="text_label">密码</label><label class="text_label" style="color:Red;">*</label></span><span class="input_span"><input type="password" id="passwd_rigester_input" onblur="checkRegisterInfo(3)"/></span><span><label id="passwdCheck_label"></label></span></div><div><span class="input_span" id="confirmpasswd_span"><label>确认密码</label><label class="text_label" style="color:Red;"> *</label></span><span class="input_span"><input type="password" id="confirmPasswd_input" onblur="checkRegisterInfo(4)"/></span><span><label id="confirmPasswdCheck_label"></label></span></div><div><span class="input_span"><label class="text_label">年级</label><label class="text_label" style="color:Red;">*</label></span><span class="input_span"><input type="text" id="grade_input" onblur="checkRegisterInfo(5)"/></span><span><label id="gradeCheck_label">格式:第20**级</label></span></div><div><span class="input_span"><label class="text_label">专业</label><label class="text_label" style="color:Red;">*</label></span><span class="input_span"><input type="text" id="major_input" onblur="checkRegisterInfo(6)"/></span><span><label id="majorCheck_label"></label></span></div><div><span class="input_span"><label class="text_label">班级</label><label class="text_label" style="color:Red;">*</label></span><span class="input_span"><input type="text" id="class_input" onblur="checkRegisterInfo(7)"/></span><span><label id="classCheck_label">格式:电信1001</label></span></div><div><span class="input_span" id="phone_span"><label class="text_label">手机</label></span><span class="input_span"><input type="text" id="phone_input" onblur="checkRegisterInfo(8)"/></span><span><label id="phoneCheck_label"></label></span></div><div class="button_div"><span><input id="register_button" type="button" onclick="summitRegisterInfo()" value="用户注册"/></span></div></div><!--end register--></div>
JS验证源代码:
/** 功能: 验证注册信息是否合法,在每次<input>控件失去聚焦时调用* 参数: num 控件编号,指示是哪个控件触发了该函数* 返回值: 如果全部合法返回true,否则给予响应的错误提示并返回false* 创建人: Lixam* 创建时间:2013-9-14* 修改人: * 修改时间:*/function checkRegisterInfo(num) { var text; switch (num) { //当点击提交按钮时校验必填项是否为空,防止直接点击提交按钮 case 0: if (document.getElementById("studentNum_input").value == "" || document.getElementById("name_input").value == "" || document.getElementById("passwd_rigester_input").value == "" || document.getElementById("confirmPasswd_input").value == "" || document.getElementById("grade_input").value == "" || document.getElementById("major_input").value == "" || document.getElementById("class_input").value == "") { alert("注册失败,打*号的项不能为空!"); return false; } else return true; break; //验证学号 case 1: text = document.getElementById("studentNum_input").value; var check = document.getElementById("studentNumCheck_label"); //验证是否为空 if (text == "") { check.style.color = "red"; check.innerText = "学号项不能为空!"; } //验证格式 else if (text.search(/^\d+$/g) == -1) { check.style.color = "red"; check.innerText = "学号应为纯数字!"; } else { //验证学号的唯一性 var xmlHttp = createXmlHttp(); xmlHttp.open("get", "Ajax.aspx?met=rigesterInfo&data=" + escape(text), true); xmlHttp.send(null); xmlHttp.onreadystatechange = function () { if (xmlHttp.readyState == 4 & xmlHttp.status == 200) { //服务器返回true表示该学号可用 if (xmlHttp.responseText) { check.style.color = "yellow"; check.innerText = "恭喜您,该学号可用!"; } else { check.style.color = "red"; check.innerText = "您输入的学号已存在,请重新输入!"; } } } } break; //验证姓名 case 2: text = document.getElementById("name_input").value; var check = document.getElementById("nameCheck_label"); if (text == "") { check.style.color = "red"; check.innerText = "名字项不能为空!"; } else { check.style.color = "yellow"; check.innerText = "名字项填写正确!"; } break; //验证密码 case 3: text = document.getElementById("passwd_rigester_input").value; var check = document.getElementById("passwdCheck_label"); if (text == "") { check.style.color = "red"; check.innerText = "密码项不能为空!"; } //密码中只能有数字、字母和标点符号 else if (text.split(" ").length != 1) { check.style.color = "red"; check.innerText = "密码中不能出现空格!"; } else { //验证密码的安全级数,纯数字或纯字母或纯标点为1级,字母+数字为2级,字母或数字任意一个+标点为3级 if ((text.search(/^[a-zA-Z]+$/g) != -1) || (text.search(/^[0-9]+$/g) != -1)) { check.style.color = "yellow"; check.innerText = "密码安全级别为1级!"; } else if (text.search(/^[a-zA-Z0-9]+$/g) != -1) { check.style.color = "yellow"; check.innerText = "密码安全级别为2级!"; } else { check.style.color = "yellow"; check.innerText = "密码安全级别为3级!"; } } break; //验证确认密码 case 4: text = document.getElementById("confirmPasswd_input").value; var check = document.getElementById("confirmPasswdCheck_label"); if (text != document.getElementById("passwd_rigester_input").value) { check.style.color = "red"; check.innerText = "两次密码输入不一致!"; } else { check.style.color = "yellow"; check.innerText = "密码确认正确!"; } break; //验证年级 case 5: text = document.getElementById("grade_input").value; var check = document.getElementById("gradeCheck_label"); if (text == "") { check.style.color = "red"; check.innerText = "年级项不能为空!"; } else if (text.search(/^\u7B2C{1}20\d+\u7EA7{1}$/) != -1) { check.style.color = "yellow"; check.innerText = "年级项填写正确!"; } else { check.style.color = "red"; check.innerText = "年级项格式为:第20**级!"; } break; //验证专业 case 6: text = document.getElementById("major_input").value; var check = document.getElementById("majorCheck_label"); if (text == "") { check.style.color = "red"; check.innerText = "专业项不能为空!"; } else if (text.search(/^[\u4e00-\u9fa5]+[a-zA-Z]*$/g) != -1) { check.style.color = "yellow"; check.innerText = "专业项填写正确!"; } else { check.style.color = "red"; check.innerText = "专业项填写不正确!"; } break; //验证班级 case 7: text = document.getElementById("class_input").value; var check = document.getElementById("classCheck_label"); if (text == "") { check.style.color = "red"; check.innerText = "班级项不能为空!"; } else if (text.search(/^[\u4e00-\u9fa5]+\d{4}$/) != -1) { check.style.color = "yellow"; check.innerText = "班级项填写正确!"; } else { check.style.color = "red"; check.innerText = "班级项格式为:电信1001!"; } break; //验证电话 case 8: text = document.getElementById("phone_input").value; var check = document.getElementById("phoneCheck_label"); if (text == "") { break; } else if (text.search(/^(\+86)?1\d{10}$/) != -1) { check.style.color = "yellow"; check.innerText = "手机项填写正确!"; } else { check.style.color = "red"; check.innerText = "手机项格式错误!"; } break; }}
- js正则表达式进行格式校验
- JS校验金额格式的正则表达式
- js校验正则格式
- js正则表达式校验
- 利用正则表达式进行校验
- js+正则表达式校验函数
- js校验常用正则表达式
- js 正则表达式校验日期
- js校验常用正则表达式
- js,身份证校验(正则表达式)
- js,身份证校验(正则表达式)
- js正则表达式校验金额
- js金钱正则表达式校验
- 手机号码正则表达式js校验
- js校验数字、正则表达式
- JavaScript 正则表达式校验日期格式
- 正则表达式案例,校验邮箱格式
- 校验数字格式的正则表达式大全
- 【荐】20 MySQL (Mysqladmin) Commands for Database Administration in Linux
- Java Regex Tutorial
- 从一道题谈C++中构造函数调用构造函数
- Clash of Clans(COC)资源打包相关技巧探密
- 百度PC客户端研发 2014校招秋季笔试题
- js正则表达式进行格式校验
- apache开启gzip的方法
- Codeforces Round #201 (Div. 1) / 346A Alice and Bob (数论&想法题)
- CODE 40: Restore IP Addresses
- 九度OnlineJudge之1029:魔咒词典
- PHP循环函数使用介绍之PHP基础入门教程
- Working Practice-别再卧室里工作
- 30 Useful Linux Commands for System Administrators【很基础的命令】
- eclipse运行 Maven Test命令时控制台输出乱码的解决办法