亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

jquery表單驗證

標簽:
JQuery


首先,导入jquery框架包

然后,布局表单

<form name="form1" action="" method="post">            <dl>                <dt><span>账号:</span><input type="text" name="member_code" id="member_code" class="input0"><label class="red" id="member_code_red"></label></dt>                <dt><span>密码:</span><input type="password" name="member_password" id="member_password" class="input0"><label class="red" id="member_password_red"></label></dt>                <dt><span>确认密码:</span><input type="password" name="password_confirm" id="password_confirm" class="input0"><label class="red" id="password_confirm_red"></label></dt>                <dt><span>手机:</span><input type="text" name="member_tel"  id="member_tel" class="input0"><label class="red" id="member_tel_red"></label></dt>                <dt><span>QQ:</span><input type="text" name="member_email_qq" id="member_email_qq" class="input0"><label class="red" id="member_email_qq_red"></label></dt>                <dt><span>EMAIL:</span><input type="text" name="member_email" id="member_email" class="input0"><label class="red" id="member_email_red"></label></dt>                <dt><span>性别:</span>&nbsp;&nbsp;女<input type="radio" name="member_sex" value="0" checked="checked">&nbsp;&nbsp;男<input type="radio" name="member_sex" value="1"><label class="red" id="member_sex_red"></label></dt>                <dt><span>会员类别:</span>&nbsp;&nbsp;类别1<input type="radio" name="member_group" value="2"checked="checked">&nbsp;&nbsp类别2<input type="radio" name="member_group" value="1"><label class="red"></label></dt>                <dt><span>推荐人:</span><input type="text" name="member_recommanded_member_id" class="input0" readonly='true'></dt>                <dt><span></span><input type="submit" name="submit" class="formsubmit"><label class="red"></label></dt>                <dt><a href="">《服务协议》</a></dt>            </dl>            </form>


最后写调用事件jquery代码


<script type="text/javascript">//表单验证jquery$(document).ready(    function(){        //用户名验证        var temp=true;        $("#member_code").blur(            function(){                var member_code=$("#member_code").val();                var reg=/^[A-Za-z0-9]+$/;//正则表达式不能加引号                var leng=parseInt(member_code.replace(/\s/g,"").length);                                  if(leng<=0){                    $("#member_code_red").html("不能为空值");temp=false;                }else if(!reg.test(member_code)){                    $("#member_code_red").html("格式错误,应由字母和数字组成");temp=false;                }else{                    $("#member_code_red").html("<img src='__ROOT__/Tpl/{:C(DEFAULT_THEME)}/Static/images/status-1.gif'>");                }                              }        );        //密码验证        $("#member_password").blur(            function(){                var member_password=$("#member_password").val();                var leng=parseInt(member_password.replace(/\s/g,"").length);                if(leng<=0){                    $("#member_password_red").html("不能为空值");temp=false;                }else if(leng<6){                    $("#member_password_red").html("密码最少6位");temp=false;                }else{                    $("#member_password_red").html("<img src='__ROOT__/Tpl/{:C(DEFAULT_THEME)}/Static/images/status-1.gif'>");                }            }        );        //密码确认        $("#password_confirm").blur(            function(){                var member_password=$("#member_password").val();                var password_confirm=$("#password_confirm").val();                var leng=parseInt(password_confirm.replace(/\s/g,"").length);                if(leng<=0){                    $("#password_confirm_red").html("不能为空值");temp=false;                }else if(member_password==password_confirm){                    $("#password_confirm_red").html("<img src='__ROOT__/Tpl/{:C(DEFAULT_THEME)}/Static/images/status-1.gif'>");                }else{                    $("#password_confirm_red").html("两次输入密码不一致");temp=false;                }            }        );        //手机号验证        $("#member_tel").blur(            function(){                var member_tel=$("#member_tel").val();                var reg=/^[1][358][0-9]{9}$/;                var leng=parseInt(member_tel.replace(/\s/g,"").length);                if(leng<=0){                    $("#member_tel_red").html("不能为空值");temp=false;                }else if(!reg.test(member_tel)){                    $("#member_tel_red").html("格式错误,请输入正确的手机号");temp=false;                }else{                    $("#member_tel_red").html("<img src='__ROOT__/Tpl/{:C(DEFAULT_THEME)}/Static/images/status-1.gif'>");                }            }        );        //QQ号验证        $("#member_email_qq").blur(            function(){                var member_email_qq=$("#member_email_qq").val();                var reg=/^\d{5,10}$/;                var leng=parseInt(member_email_qq.replace(/\s/g,"").length);                if(leng<=0){                    $("#member_email_qq_red").html("不能为空值");temp=false;                }else if(!reg.test(member_email_qq)){                    $("#member_email_qq_red").html("格式错误,请输入正确的QQ号");temp=false;                }else{                    $("#member_email_qq_red").html("<img src='__ROOT__/Tpl/{:C(DEFAULT_THEME)}/Static/images/status-1.gif'>");                }            }        );        //邮箱验证        $("#member_email").blur(            function(){                var member_email=$("#member_email").val();                var reg=/^[\w\-\.]+@[\w\-\.]+(\.\w+)+$/;                var leng=parseInt(member_email.replace(/\s/g,"").length);                if(leng<=0){                    $("#member_email_red").html("不能为空值");temp=false;                }else if(!reg.test(member_email)){                    $("#member_email_red").html("格式错误,请输入正确的邮箱");temp=false;                }else{                    $("#member_email_red").html("<img src='__ROOT__/Tpl/{:C(DEFAULT_THEME)}/Static/images/status-1.gif'>");                }            }        );        //表单提交        $("#form").submit(            function(){                                  $("#member_code").blur();                $("#member_password").blur();                $("#password_confirm").blur();                $("#member_tel").blur();                $("#member_email_qq").blur();                $("#member_email").blur();                var length=parseInt($("#member_code_red").text().length)+                            parseInt($("#member_password_red").text().length)+                            parseInt($("#password_confirm_red").text().length)+                            parseInt($("#member_tel_red").text().length)+                            parseInt($("#member_email_qq_red").text().length)+                            parseInt($("#member_email_red").text().length);                if(length>0){return false;}            }        );              });</script>


點擊查看更多內容
TA 點贊

若覺得本文不錯,就分享一下吧!

評論

作者其他優質文章

正在加載中
  • 推薦
  • 評論
  • 收藏
  • 共同學習,寫下你的評論
感謝您的支持,我會繼續努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進行掃碼打賞哦
今天注冊有機會得

100積分直接送

付費專欄免費學

大額優惠券免費領

立即參與 放棄機會
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

舉報

0/150
提交
取消