zoukankan      html  css  js  c++  java
  • jquery validation插件使用

    首先需要引入jQuery.js和jquery.validate.js

    以下面代码为例:

    <form id="mainform">

    <fieldset>

    <legend>用户登录</legend></fieldset>

    <p><label for="username">用户名</label><input name="username" type="text"/></p>

    <p><label for="password">密码</label><input name="password" id="password" type="password"/></p>

    <p><label for="confirm-password">密码</label><input name="confirm-password" type="password"/></p>

    <p><button type="submit"></button></p>

    </form>

    <script>

    $("#mainform").validate({

      debug:true,

      rules:{

        username:{

          required:true,

          minlength:2,

          maxlength:10

        },

        password:{

          ...

         },

        "confirm-password":{//注意由于名字里有-,所以需要“”

          equalTo:"#password"

         },

        messages:{

          username:{

            required:"必填",

            minlength:“密码最小为。。”,

            maxlength:“。。。”,

            //remote:validate.json//远程验证该用户名是否存在

          },

          password:{

            ...

           }

        }

      }

    });

    </script>

     还有一个debug属性,主要用于调试:当debug:true时,表单点击按钮时不会提交,可以帮助调试。

    好了,下面说说validate的基本验证方法:required,remote(远程校验),minlength,maxlength,rangelength(长度范围),min,max,range(值范围)

    email,url,date,dateISO(ISO日期),number(数字),digits(非负整数),equalTo(与另一个元素值相等)

    remote的使用如上述注释代码,默认采用get方式,当然,还可以自己配置:

    remote{

      url:"remote.json",//还可以html,aspx等

      type:'post',

      data:{

        logintime:function(0{

          return +new Date();

        }

      }

    }

    email:true

    ISOdate指标准日期 yyyy-mm-dd

    equalTo可以用确认密码来理解,如上述代码

  • 相关阅读:
    RecyclerView,ListView first item get focus
    一种粗暴快速的Android全屏幕适配方案(转)
    谈谈单元测试之(一):为什么要进行烦人的单元测试(转)
    SCIgen与野鸡期刊的梗
    百度搜索仍然是【最快解决工作问题的方法】
    搭建minima主题的github博客网站
    本科期间的第一个专利:改卷筒的故事
    学习消费思维的【贫穷与富有】
    我的联系方式
    学习 GitHub 有什么好处?
  • 原文地址:https://www.cnblogs.com/openflyme/p/4745584.html
Copyright © 2011-2022 走看看