jQuery Valider la fonction de vérification du format, exemple de partage de code-js tutoriel-php.cn

jQuery Valider la fonction de vérification du format, exemple de partage de code
小云云
Libérer： 2017-12-31 16:50:25
original
1254 Les gens l'ont consulté
Cet article présente la fonction de vérification du format jQuery Validate à tout le monde à travers un exemple de code. Le code inclut la méthode de vérification des noms en double. Les amis qui en ont besoin peuvent s'y référer.
Introduire deux fichiers js jQuery-1.7.1.js et jquery.validate.js
<!DOCTYPE html>  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  <title></title>  
  <script src="Scripts/jquery-1.7.1.js"></script>  
  <script src="Scripts/jquery.validate.js"></script>  
  <script>  
    $().ready(function () {  
      ///自定义ajax验证  
      jQuery.validator.addMethod("ExistsCompany", function (value, element) {  //用jquery ajax的方法验证电话是不是已存在   
        var flag = 1;  
        $.ajax({  
          type: "POST",  
          url: &#39;/CustomerMonkey/ExistsCompanyAction&#39;,  
          async: false,  
          data: {  
            &#39;name&#39;: value, "monkeyid": GetQueryString("monkeyid"), "customerid": function () {  
              return $("#hidCustomerID").val();  
            }  
          },  
          success: function (data) {  
            if (data.result == "TRUE") {  
              flag = 0;  
            }  
            else if (data.result == "NO") {  
              compaymsg = "Name does not exist";  
            }  
          }  
        });  
        if (flag == 0) {  
          return true;  
        } else {  
          return false;  
        }  
      }, compaymsg);  
      $("#form1").validate({  
        rules: {  
          txtUserName:  
          {  
            required: true,  
            minlength: 6,  
            rangelength: [6, 20],      //长度5-10之间  
            remote: {  
              url: "/admin/CheckName",  //后台处理程序  
              type: "post",        //数据发送方式  
              dataType: "json",      //接受数据格式  
              data: {           //要传递的数据  
                name: function () {  
                  return $("#txtUserName").val();  
                }  
              }  
            },  
            ExistsCompany: true,  
          },  
          txtPassword: {  
            required: true,  
            minlength: 6,  
            rangelength: [6, 20],  //长度5-10之间  
            password: true,  
          },  
          txtPwd: {  
            required: true,  
            equalTo: "#txtPassword",  
            minlength: 6,  
            rangelength: [5, 20],  //长度5-10之间  
            password: true,  
          },  
          txtDisplayName: {  
            required: true,  
            minlength: 6,  
            rangelength: [6, 20],  //长度5-10之间  
          },  
          txtAge: {  
            required: true,  
            digits: true,  
            min: 1,  
            max: 100  
          },  
          sex: {  
            required: true,  
          },  
          txtCard: {  
            required: true,  
            creditcard: true,  
          },  
          txtidcard: {  
            required: true,  
            idcard: true,  
          },  
          txtEmail: {  
            required: true,  
            email: true,  
          },  
          txtTel: {  
            required: true,  
            phone: true,  
          },  
          txtQQ: {  
            required: true,  
            qq: true,  
          },  
          txtUrl: {  
            required: true,  
            url: true,  
          },  
          txtZipCode: {  
            required: true,  
            zipcode: true  
          },  
          txtDate: {  
            required: true,  
            date: true,  
          },  
          txtISO: {  
            required: true,  
            dateISO: true,  
          },  
          filFile: {  
            required: true,  
            filetype: ["mp3", "wma", "wav"]  
          }  
        },  
        messages: {  
          txtUserName: {  
            required: "请输入登录名",  
            minlength: jQuery.format("登录名不能小于{0}个字符"),  
            rangelength: "长度必须介于{0} 和 {1} 之间的字符串",  
            remote: "登录名已存在",  
          },  
          txtPassword: {  
            required: "请输入密码",  
            minlength: jQuery.format("密码不能小于{0}个字符"),  
            rangelength: "长度必须介于{0} 和 {1} 之间的字符串",  
            password: "密码只能是数字、字母与下划线"  
          },  
          txtPwd: {  
            required: "请输入确认密码",  
            minlength: "确认密码不能小于5个字符",  
            rangelength: "长度必须介于{0} 和 {1} 之间的字符串",  
            equalTo: "两次输入密码不一致不一致",  
            password: "密码只能是数字、字母与下划线"  
          },  
          txtDisplayName: {  
            required: "请输入用户名",  
            minlength: jQuery.format("密码不能小于{0}个字符"),  
            rangelength: "长度必须介于{0} 和 {1} 之间的字符串",  
          },  
          txtAge: {  
            required: "请输入年龄",  
            digits: "只能输入数字",  
            min: "最小值是1",  
            max: "最大值是100"  
          },  
          sex: {  
            required: "请选择性别",  
          },  
          txtCard: {  
            required: "请输入信用卡",  
            creditcard: "请输入信用卡",  
          },  
          txtidcard: {  
            required: "请输入身份证号",  
            idcard: "身份证号格式不正确",  
          },  
          txtEmail: {  
            required: "请输入邮箱",  
            email: "邮箱格式不正确",  
          },  
          txtTel: {  
            required: "请输入手机",  
            phone: "手机格式不正确"  
          },  
          txtQQ: {  
            required: "请输入QQ",  
            qq: "qq格式不正确",  
          },  
          txtUrl: {  
            required: "请输入网址",  
            url: "请输入正确的网址",  
          },  
          txtZipCode: {  
            required: "请输入邮编",  
            zipcode: "邮编格式不正确"  
          },  
          txtDate: {  
            required: "请输入时间",  
            date: "日期格式不正确",  
          },  
          txtISO: {  
            required: "请输入ISO",  
            dateISO: "ISO格式错误"  
          },  
          filFile: {  
            required: "请选择文件",  
            filetype: "只能上传MP3,WMA,WAV格式文件",  
          }  
        },  
        submitHandler: function (form) {  
          //避免重复提交数据  
          $(form).find(":submit").attr("disabled", true);  
          form.submit();  
        },  
        //指定错误信息位置  
        errorPlacement: function (error, element) {  
          if (element.is(&#39;:radio&#39;) || element.is(&#39;:checkbox&#39;)) { //如果是radio或checkbox  
            var eid = element.attr(&#39;name&#39;);           //获取元素的name属性  
            error.appendTo(element.parent());          //将错误信息添加当前元素的父结点后面  
          } else {  
            error.insertAfter(element);  
          }  
        },  
      });  
    });  
  </script>  
</head>  
<body>  
  <form id="form1" runat="server">  
    <p>  
      <p>  
        <label>登录名：</label>  
        <input id="txtUserName" name="txtUserName" class="sf" type="text" value="" />  
      </p>  
      <p>  
        <label>密码：</label>  
        <input id="txtPassword" name="txtPassword" class="sf" type="password" value="" />  
      </p>  
      <p>  
        <label>确认密码：</label>  
        <input id="txtPwd" name="txtPwd" type="password" value="" class="sf" />  
      </p>  
      <p>  
        <label>用户名：</label>  
        <input id="txtDisplayName" name="txtDisplayName" class="mf" type="text" value="" />  
      </p>  
      <p>  
        <label>年龄：</label>  
        <input id="txtAge" name="txtAge" class="mf" type="text" value="" />  
      </p>  
      <p>  
        <label>性别：</label>  
        <input id="Radio1" type="radio" value="" name="sex" />男<input id="Radio2" type="radio" value="" name="sex" />女  
      </p>  
      <p>  
        <label>信用卡：</label>  
        <input id="txtCard" name="txtCard" class="sf" type="text" value="" />  
      </p>  
      <p>  
        <label>身份证：</label>  
        <input id="txtidcard" name="txtidcard" class="sf" type="text" value="" />  
      </p>  
      <p>  
        <label>邮箱：</label>  
        <input id="txtEmail" name="txtEmail" class="sf" type="text" value="" />  
      </p>  
      <p>  
        <label>手机：</label>  
        <input id="txtTel" name="txtTel" class="sf" type="text" value="" />  
      </p>  
      <p>  
        <label>QQ：</label>  
        <input id="txtQQ" name="txtQQ" class="sf" type="text" value="" />  
      </p>  
      <p>  
        <label>网址：</label>  
        <input id="txtUrl" name="txtUrl" class="sf" type="text" value="" />  
      </p>  
      <p>  
        <label>邮编：</label>  
        <input id="txtZipCode" name="txtZipCode" class="sf" type="text" value="" />  
      </p>  
      <p>  
        <label>时间：</label>  
        <input id="txtDate" name="txtDate" class="sf" type="text" value="" />  
      </p>  
      <p>  
        <label>ISO：</label>  
        <input id="txtISO" name="txtISO" class="sf" type="text" value="" />  
      </p>  
      <p>  
        <label>文件：</label>  
        <input id="filFile" name="filFile" type="file" />  
      </p>  
    </p>  
    <input id="Submit1" type="submit" value="submit" />  
  </form>  
</body>  
</html>  
 
password: function (value, element) {  
      return this.optional(element) || /^\w+$/.test(value);  
    },  
    address: function (value, element) {  
      return this.optional(element) || /^[a-zA-Z0-9][a-zA-Z0-9\s]+$/.test(value);  
    },  
    ///固定电话123-85611111 或 0311-8561111  
    phone: function (value, element) {  
      return this.optional(element) || /^\d{3}-\d{8}$|\d{4}-\d{7}$/.test(value);  
    },  
    ///13866666666  
    telphone: function (value, element) {  
      return this.optional(element) || /^(\+86)|(86)?1[3,5,8]{1}[0-9]{1}[0-9]{8}$/.test(value)  
    },  
    mobilephone: function (value, element) {  
      return this.optional(element) || /^\d{3}-\d{8}$|\d3\d{8}$|\d{4}-\d{7}$|\d4\d{7}$|1[358]\d{9}$/.test(value);  
    },  
    //身份证号  
    idcard: function (value, element) {  
      return this.optional(element) || /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(value);  
    },  
    ///上传文件格式验证  
    filetype: function (value, element, param) {  
      var fileType = value.substring(value.lastIndexOf(".") + 1).toLowerCase();  
      return this.optional(element) || $.inArray(fileType, param) != -1;  
    },
Copier après la connexion
Recommandations associées :
Résoudre jquery . validate.js Traitement de validation pour plusieurs noms portant le même nom
Tutoriel pratique étape par étape de JQuery Validate
Cours recommandés sur Valider la vérification
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!