首先需要引入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可以用确认密码来理解,如上述代码

jquery validation插件使用的更多相关文章

  1. jquery validation插件

    jQuery Validate验证框架详解 jQuery校验官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation 一.导 ...

  2. Jquery Validation 插件验证手机号

    自定义手机号验证代码  http://www.2cto.com/kf/201505/402781.html // 手机号码验证 jQuery.validator.addMethod("isM ...

  3. 解决 jQuery validation插件 valid()方法总是返回true的问题

    在表单元素验证方法中加入了 remote 方法,调试一直返回true,后来才知道因为是异步验证,所以才会出现此问题,解决方法就是在 remote 方法中,禁用 异步和缓存,具体代码如下 : ..... ...

  4. 转载 jQuery validation

    之前做客户端验证感觉自己javascript 不行,虽然能写出来一完整的验证,但从不自信,一直觉得客户端验证是比较繁琐的事情,但是又不能不做,只到最开始接触ajax ,遇到了一个jQuery vali ...

  5. jQuery validation

    之前做客户端验证感觉自己javascript 不行,虽然能写出来一完整的验证,但从不自信,一直觉得客户端验证是比较繁琐的事情,但是又不能不做,只到最开始接触ajax ,遇到了一个jQuery vali ...

  6. 清空jQuery validation 显示的错误信息

    现在做个BS结构的查询系统,登陆的时候添加个重置的按钮. 他的功能主要是: 1.清空Input的text 2.jQuery validation插件当错误的时候显示的信息,解决方法如下面的代码 var ...

  7. jQuery 表单验证插件 jQuery Validation Engine 使用

    jQuery 表单验证插件 jQuery Validation Engine 使用方式如下: 1.引入头文件(注意一定要把jQuery放在前面),指定使用 jQuery Validation Engi ...

  8. (转)jQuery Validation Plugin客户端表单证验插件

    jQuery Validation Plugin客户端表单验证插件 官方文档:http://jqueryvalidation.org/documentation/ 官方demo:http://jque ...

  9. 表单验证的validate.js插件---jQuery Validation Plugin

    早上在公交车上看了一个关于慕课网的教程<表单验证的validate.js插件---jQuery Validation Plugin>,正好可以用到自己近期开发简易微博的注册页面和登录页面, ...

随机推荐

  1. Windows NT 驱动程序开发人员提示 -- 应注意避免的事项

    下面是开发人员在使用 Windows NT 设备驱动程序时应当避免的事项列表: 1.  一定不要在没有标注 I/O 请求数据包 (IRP) 挂起 (IoMarkIrpPending) 的情况下通过调度 ...

  2. 【HDOJ】1314 Numerically Speaking

    学了几天的Java了,终于独立A了一道大数计算.感觉还得练Java啊. import java.util.Scanner; import java.math.BigInteger; import ja ...

  3. BZOJ 1027 [JSOI2007]合金

    1027: [JSOI2007]合金 Time Limit: 4 Sec  Memory Limit: 162 MBSubmit: 2605  Solved: 692[Submit][Status][ ...

  4. 《Ruby语言入门教程v1.0》学习笔记-01

    <Ruby语言入门教程v1.0> 编著:张开川 邮箱:kaichuan_zhang@126.com 想要学习ruby是因为公司的自动化测试使用到了ruby语言,但是公司关于ruby只给了一 ...

  5. 基于用户映射的CAS单点登录系统设计与实现

    http://wenku.baidu.com/link?url=wAZR9AMkAAcOt5J_SfroXqU5IM5RhNWaP0-YUwvZT94761Qq1-7pKAt6ngOX1zG4tYec ...

  6. Selenium各种工具比较

    Selenium 1.0 Selenium 1.0是第一个基于浏览器的开源自动化测试工具.它可以使用所有支持http库的编程语言,也可以运行在所有支持javascript的浏览器上.当然它 也有它的缺 ...

  7. VC —— 笔记汇总

    导读 本文仅用于记录在个人在使用VC++过程中的遇到一些的问题和相关概念. 目录 开发环境 实践记录 MFC相关 windows编程相关 1.开发环境 1.Visual C++ 官方网站 主要内容:V ...

  8. SKAction类

    继承自 NSObject 符合 NSCodingNSCopyingNSObject(NSObject) 框架  /System/Library/Frameworks/SpriteKit.framewo ...

  9. C primer plus 读书笔记第五章

    本章的标题是运算符,表达式和语句.主要研究如何处理数据. 示例代码展示了一个使用简单的while循环的代码,难度不大. 下面简单介绍本章的基本概念. 1.基本运算符. 基本运算符有:赋值运算符(C语言 ...

  10. 斐波那契数列(fabnacci)java实现

    斐波那契数列定义:From Wikipedia, the free encyclopedia http://en.wikipedia.org/wiki/Fibonacci_number In math ...