• jquery的validate表单验证


    html:

    <form id="reg" action="123.html">
    <p class="myerror"></p>
    <p>帐号:<input type="text" name="user" id="user" /></p>
    <p>密码:<input type="text" name="pass" id="pass" /></p>
    <p>邮编:<input type="text" name="code" id="code" /></p>
    <p><input type="submit" value="提交" /></p>
    </form>

    css:(部分)

    .valid {
      background:url(../img/reg_succ.png) no-repeat right;//图片为成功的
    }

     js:

    $(function () {

      //自定义验证规则
      $.validator.addMethod(
        "code",
        function(value,element){
          var tel=/^[0-9]{6}$/;
          return this.optional(element) || (tel.test(value));
        },
        "请输入正确的邮政编码!"
      );

      //插件验证
      $('#reg').validate({
        submitHandler : function (form) {
          alert('验证成功,准备提交!');
        },
        rules:{
          user:{
             required:true,
             minlength:6
          },
          pass:{
             required:true,
             minlength:6
          },
          code:{
            required:true,
            code:true
          }
        },
        messages:{
          user:{
            required:"用户名不为空!",
            minlength:"最小长度不少于6位"
          },
          pass:{
            required:"密码不为空!",
            minlength:"最小长度不少于6位"
          },
         code:{
           required:"邮箱不为空"
         }
       }
    })
    });

    效果图:

    日常所遇,随手而记。
  • 相关阅读:
    汇编实验四
    汇编实验三
    C语言常用标准库函数
    实验一
    NGUI的缓动
    unity之Hashtable ArrayList List
    有关Unity 的一些 笔记之
    有关Unity 的一些 笔记之场景
    有关Unity 的一些 笔记之prefab
    有关Unity 的一些 笔记之消息事件
  • 原文地址:https://www.cnblogs.com/zhihou/p/7760582.html
Copyright © 2020-2023  润新知