這篇文章主要介紹了jquery實現用戶信息修改驗證輸入方法,實例匯總了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程序設計有所幫助。
新聞熱點
疑難解答
圖片精選