zoukankan      html  css  js  c++  java
  • 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:"邮箱不为空"
         }
       }
    })
    });

    效果图:

    日常所遇,随手而记。
  • 相关阅读:
    需求的陷阱
    VS2008 NumericUpDown控件 内容全选
    KeyPress 事件中 keycode对应的按键
    C#发送邮件
    Stream 和Byte[] 之间的转换
    SQL ISNULL() 函数
    修改struts2的.action后缀名
    #pragma data_seg
    VBA中Option的四种用法
    SetWindowsHookEx
  • 原文地址:https://www.cnblogs.com/zhihou/p/7760582.html
Copyright © 2011-2022 走看看