ホームページ >ウェブフロントエンド >jsチュートリアル >jqueryはユーザー情報変更検証入力メソッドを実装する summary_jquery
本文实例讲述了jquery实现用户信息修改验证输入方法。分享给大家供大家参考。具体如下:
var realnameFlag = 0; var addressFlag = 0; var zipFlag=0; var cellphoneFlag=0; var homephoneFlag=0; var oldpasswordFlag=1; var newpasswordFlag=1; //判断email function check_email() { $("#showSpan").hide(); var email = $.trim($("#email").val()); if (email == null || email == "") { emailFlag = 1; $("#emailMsg").html("<span class='tips'>请输入邮箱信息</span>"); return; } // 判断输入框内是否为邮箱格式 if (email.replace(/[^\x00-\xff]/g, "**").length <= 4 || email.replace(/[^\x00-\xff]/g, "**").length >= 50) { $("#emailMsg").html("<span class='tips'>邮箱长度不正确</span>"); emailFlag = 1; return ; } var reg = /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/; if (reg.test(email)) { $("#emailMsg").html(""); emailFlag = 0; return ; } else { $("#emailMsg").html("<span class='tips'>邮箱格式不正确</span>"); emailFlag = 1; return ; } } function check_realname() { $("#showSpan").hide(); var realname = $.trim($("#realname").val()); // 判断是否为空 if (realname == null || realname == "") { $("#realnameMsg").html("<span class='tips'>请输入真实姓名,20个英文或10个汉字</span>"); realnameFlag = 1; } else if (realname.indexOf("··") != -1) { $("#realnameMsg").html("<span class='tips'>请输入真实姓名,20个英文或10个汉字</span>"); realnameFlag = 1; // 姓名前后不能加· } else if (realname.substring(0, 1) == "·" || realname.substring(realname.length - 1) == "·") { realnameFlag = 1; $("#realnameMsg").html("<span class='tips'>请输入真实姓名,20个英文或10个汉字</span>"); } else { var reg = new RegExp("^([a-zA-Z]|[\\u4E00-\\u9FFF])+$", "g"); if (!reg.test(realname)) { $("#realnameMsg").html("<span class='tips'>请输入真实姓名,20个英文或10个汉字</span>"); realnameFlag = 1; } else if (realname.replace(/[^\x00-\xff]/g, "**").length >= 4 && realname.replace(/[^\x00-\xff]/g, "**").length <= 20) { realnameFlag = 0; $("#realnameMsg").html(""); } else { realnameFlag = 1; $("#realnameMsg").html("<span class='tips'>请输入真实姓名,20个英文或10个汉字</span>"); } } } function check_cellphone() { $("#showSpan").hide(); var cellphone = $.trim($("#cellphone").val()); while (true) { var start = cellphone.substring(0, 1); if (start == "0") { cellphone = cellphone.substring(1); } else { break; } } $("#cellphone").val(cellphone); if (cellphone == null || cellphone == "") { $("#cellphoneMsg").html("<span class='tips'>请输入移动电话号码</span>"); cellphoneFlag = 1; return; } var re = /^1{1}[3,4,5,8]{1}\d{9}$/; // 判断是否为数字的正则表达式 if (!re.test(cellphone)) { cellphoneFlag = 1; $("#cellphoneMsg").html("<span class='tips'>请输入正确的移动电话号码</span>"); return; } else { cellphoneFlag = 0; $("#cellphoneMsg").html(""); } } function check_homephone() { $("#showSpan").hide(); var homephone = $.trim($("#homephone").val()); if(homephone == null || homephone == "") { homephoneFlag=0; $("#homephoneMsg").html(""); return ; } var re=/(^(\d{3,4}-)?\d{7,8})$|(^1{1}[3,4,5,8]{1}\d{9}$)/; if(!re.test(homephone)) { homephoneFlag=1; $("#homephoneMsg").html("<span class='tips'>请正确输入电话号码,格式为: 000-00000000</span>"); return ; }else { homephoneFlag=0; $("#homephoneMsg").html(""); } } function check_address() { $("#showSpan").hide(); var address = $.trim( $("#address").val()); // 判断是否为空 if(address == null || address == "") { $("#addressMsg").html("<span class='tips'>请输入详细地址</span>"); addressFlag = 1; }else if (address.replace(/[^\x00-\xff]/g, "**").length > 120) { addressFlag = 1; $("#addressMsg").html("<span class='tips'>长度超长</span>"); } else { addressFlag = 0; $("#addressMsg").html(""); } } function check_zip() { $("#showSpan").hide(); var zip=$.trim($("#zip").val()); var re=/^[0-9]+$/; if(zip.length != 0 && (!re.test(zip) || zip.length != 6)) { zipFlag=1; $("#zipMsg").html("<span class='tips'>请输入邮政编码,由6位数字组成</span>"); }else { zipFlag=0; $("#zipMsg").html(""); } } function check_oldPassword() { $("#msgSpan").html(""); $("#newpsMsg").html(""); $("#repsMsg").html(""); var oldPS = $.trim($("#oldPassword").val()); if(oldPS == null || oldPS == "") { oldpasswordFlag = 1; $("#oldpsMsg").html("<span class='tips'>请输入旧密码</span>"); $(this).focus(); return false; } var re=/^.{6,16}$/; if(!re.test(oldPS)) { oldpasswordFlag = 1; $("#oldpsMsg").html("<span class='tips'>旧密码输入长度不正确</span>"); $(this).focus(); return false; } else { oldpasswordFlag = 0; $("#oldpsMsg").html(""); } } function check_newPassword() { $("#oldpsMsg").html(""); $("#repsMsg").html(""); $("#msgSpan").html(""); $("#repeatPassword").val(""); var newPS = $.trim($("#newPassword").val()); if(newPS == null || newPS == "") { newpasswordFlag=1; $("#newpsMsg").html("<span class='tips'>请输入新密码,由6-16位字符组成!</span>"); $(this).focus(); return false; } //var re=/^[A-Za-z0-9_-]{6,16}$/; var re=/^.{6,16}$/; if (newPS.replace(/[^\x00-\xff]/g, "**").length <6 || newPS.replace(/[^\x00-\xff]/g, "**").length > 16) { newpasswordFlag = 1; $("#newpsMsg").html("<span class='tips'>新密码长度不正确</span>"); $(this).focus(); return false; } if(!re.test(newPS)) { newpasswordFlag = 1; $("#newpsMsg").html("<span class='tips'>新密码长度不正确</span>"); $(this).focus(); return false; }else { newpasswordFlag = 0; $("#newpsMsg").html(""); } } function check_repeatPassword() { $("#oldpsMsg").html(""); $("#newpsMsg").html(""); $("#msgSpan").html(""); if( $("#repeatPassword").val()==null || $.trim($("#repeatPassword").val()) =="") { $("#repsMsg").html("<span class='tips'>请输入重复新密码</span>"); $(this).focus(); newpasswordFlag = 1; return false; }else if ( $.trim($("#repeatPassword").val()) != $.trim($("#newPassword").val())) { newpasswordFlag = 1; $("#repsMsg").html("<span class='tips'>两次密码输入的不一致!</span>"); $(this).focus(); return false; }else { newpasswordFlag = 0; $("#repsMsg").html(""); } } function check_cardNum() { $("#vcodeMsg").html(""); $("#psMsg").html(""); $("#strmsg").hide(); var cardnum = $.trim( $("#cardNum").val()); if(cardnum == null || cardnum == "") { $("#numMsg").html("<span class='tips'>请输入卡号</span>"); cardnumFlag = 1; return false; }else { $("#numMsg").html(""); cardnumFlag=0; } } function check_passWord() { $("#vcodeMsg").html(""); $("#numMsg").html(""); $("#strmsg").hide(); var password = $.trim( $("#passWord").val()); if(password == null || password == "" ) { passwordFlag = 1; $("#psMsg").html("<span class='tips'>请输入密码</span>"); return false; }else { passwordFlag = 0; $("#psMsg").html(""); } } function check_vcode() { $("#vcodeMsg").html(""); $("#psMsg").html(""); $("#numMsg").html(""); $("#strmsg").hide(); var vcode = $.trim( $("#vcode").val()); if(vcode == null || vcode =="") { vcodeFlag = 1; $("#vcodeMsg").html("<span class='tips'>请输入验证码</span>"); return false; } var re= /^[0-9]*$/; if(!re.test(vcode)) { vcodeFlag = 1; $("#vcodeMsg").html("<span class='tips'>请正确输入验证码</span>"); return false; }else { vcodeFlag = 0; $("#vcodeMsg").html(""); } } $(document).ready(function() { /*** 修改用户信息验证 begini */ // begin email $("#email").focus(function() { check_email();}); // 邮箱格式判断 $("#email").blur(function(){check_email();}); //end email //bengin realname $("#realname").focus(function() {check_realname();}); // 校验realname是否正确 $("#realname").blur(function() {check_realname();}); //end realname //bengin cellphone $("#cellphone").focus(function() { check_cellphone(); }); // 手机号码格式判断 $("#cellphone").blur(function() { check_cellphone(); }); //end cellphone //bengin homephone $("#homephone").focus(function(){ check_homephone(); }); $("#homephone").blur(function(){ check_homephone();}); //end homephone //bengin addr // 校验address是否正确 $("#address").focus(function(){ check_address(); }); $("#address").blur(function() { check_address();}); //end addr //bengin zip $("#zip").focus(function(){ check_zip(); }); $("#zip").blur(function(){ check_zip(); }); //end zip //获取市级 $("#province").change(function(){ var province=$(this).val(); $.post("_jquery", {"type":"getProvince" , province:province}, function(msg){ $("#city").html(msg); $("#region").html(""); }); }); //获取县级 $("#city").change(function(){ var city=$(this).val(); $.post("_jquery", {"type":"getCity" , city:city}, function(msg){ $("#region").html(msg); }); }); /*** 修改用户信息验证 end ***********/ /***------密码修改验证 begin *************/ //begin oldpassword $("#oldPassword").focus(function(){ check_oldPassword();}); $("#oldPassword").blur(function(){ check_oldPassword();}); //end oldpassword //begin newpassword $("#newPassword").focus(function(){ check_newPassword();}); //newpassword $("#newPassword").blur(function(){ check_newPassword();}); // repeatpassword $("#repeatPassword").focus(function(){ check_repeatPassword();}); $("#repeatPassword").blur(function(){ check_repeatPassword();}); /***------密码修改验证 end *************/ /**** ---------卡查询表单提交验证 begin ***********/ var cardnumFlag = 0; var passwordFlag = 0; var vcodeFlag = 0; $("#cardNum").focus(function(){ check_cardNum();}); $("#cardNum").blur(function(){ check_cardNum();}); $("#passWord").focus(function(){ check_passWord();}); $("#passWord").blur(function(){ check_passWord();}); $("#vcode").focus(function(){ check_vcode(); }); $("#vcode").blur(function(){ check_vcode(); }); $("#formsubmit").click(function(){ $("#strmsg").hide(); $("#numMsg").html(""); $("#psMsg").html(""); $("#vcodeMsg").html(""); var re= /^[0-9]*$/; if(cardnumFlag != 0 || $.trim($("#cardNum").val()) == "" || $("#cardNum").val() == null ) { $("#cardNum").focus(); return ; } if(passwordFlag != 0 || $.trim($("#passWord").val()) == "" || $("#passWord").val() == null) { $("#passWord").focus(); return ; } if(($("#vcode").val() != "" && !re.test($("#vcode").val())) || vcodeFlag != 0 || $("#vcode").val() == "" ) { $("#vcode").focus(); return ; } $("#cardform").submit(); }); /**** ---------卡查询表单提交验证 end ***********/ //用户订单取消, $("#cancelreason").focus(function(){ $("#errorinfo").html(""); $("#errorinfo").removeClass("tips"); }); $("#cancelreason").bind('input propertychange', function() { var maxLength = 65; if ($(this).val().length > maxLength) { $(this).val($(this).val().substring(0, maxLength)); } return false; }) //----- }); //end ready //修改用户信息表单提交 function formsubmit() { $("#showSpan").hide(); var province=$("#province").val(); var city=$("#city").val(); var region=$("#region").val(); $("#emailMsg").html(""); $("#realnameMsg").html(""); $("#cellphoneMsg").html(""); $("#homephoneMsg").html(""); $("#szcode").html(""); $("#addressMsg").html(""); $("#zipMsg").html(""); if(emailFlag != 0 || $("#email").val()== null || $("#email").val()== "") { $("#email").focus(); return ; } if(realnameFlag != 0 || $("#realname").val()== null || $("#realname").val()== "") { $("#realname").focus(); return ; } if($("input[name=sex]:checked").val()==null||$("input[name=sex]:checked").val()==""){ alert("请选择性别"); $("#sex").focus(); return; } if(cellphoneFlag != 0) { $("#cellphone").focus(); return ; } if(homephoneFlag != 0) { $("#homephone").focus(); return ; } if( province == "" || city == "" || region== "" || province == null || city == null || region== null) { $("#szcode").html("<span class='tips'>请选择地区</span>"); return ; } if(addressFlag != 0 || $("#address").val() == null || $("#address").val() == "") { $("#address").focus(); return ; } if(zipFlag != 0) { $("#zip").focus(); return ; } $("#myform").submit(); } //修改用户信息表单重置 function formreset() { $("#showSpan").hide(); document.forms["myform"].reset(); $("#emailMsg").html(""); $("#realnameMsg").html(""); $("#cellphoneMsg").html(""); $("#homephoneMsg").html(""); $("#addressMsg").html(""); $("#zipMsg").html(""); $("#szcode").html(""); $("#province").html($("#hprovince").val()); $("#city").html($("#hcity").val()); $("#region").html($("#hregion").val()); } //修改密码提交form function psformSubmit() { $("#oldpsMsg").html("");; $("#newpsMsg").html(""); $("#repsMsg").html(""); var oldps = $.trim($("#oldPassword").val()); var newps = $.trim( $("#newPassword").val()); var reps = $.trim($("#repeatPassword").val()); if( oldpasswordFlag != 0 || oldps =="" || oldps ==null ) { $("#oldPassword").focus(); return ; } if(newpasswordFlag != 0 || newps =="" || newps ==null ) { $("#newPassword").focus(); return ; } if( newpasswordFlag != 0 || reps == null || reps =="" || reps != newps) { $("#repeatPassword").focus(); return ; } $("#psform").submit(); } //获取验证码 function dochange() { ///$("#vcodeImg").attr("src","_verifycode?" + new Date()); var imgObj="#vcodeImg"; $(imgObj).fadeOut('fast', function(){ var datenow = new Date(); $(this).attr('src', '_verifycode?ver=' + datenow.getMilliseconds()).delay(200).fadeIn('slow'); }); } function removefavorite(goodsid) { if(confirm('确定删除商品吗?')) { document.location.href="/myremovefavorite.html?goodsid="+goodsid; } } function selectProvince(value) { //导出省份下市区 信息。 $.post("_jquery", {"type":"getProvince",province:value}, function(data){ $("#city").html(data); $("#region").html(""); }); } function selectCity(value) { //导出市区 下县城信息。 $.post("_jquery", {"type":"getCity",city:value}, function(data){ $("#region").html(data); }); }
希望本文所述对大家的jquery程序设计有所帮助。