http://www.runoob.com/jquery/jquery-plugin-validate.html

jquery validate 默认 在键盘按下并释放及提交后验证提交表单

例如:

$().ready(function() {
// 在键盘按下并释放及提交后验证提交表单
$("#signupForm").validate({
rules: {
firstname: "required",
lastname: "required",
username: {
required: true,
minlength: 2
}
},
messages: {
firstname: "请输入您的名字",
lastname: "请输入您的姓氏",
username: {
required: "请输入用户名",
minlength: "用户名必需由两个字母组成"
}
})
});

用其他方式替代默认的 SUBMIT

$().ready(function() {
$("#signupForm").validate({
rules: {
firstname: "required",
lastname: "required",
username: {
required: true,
minlength: 2
}
},
messages: {
firstname: "请输入您的名字",
lastname: "请输入您的姓氏",
username: {
required: "请输入用户名",
minlength: "用户名必需由两个字母组成"
},
submitHandler:function(form){
alert("提交事件!");
form.submit();
}
});
});

使用 ajax 方式

 $(".selector").validate({
submitHandler: function(form)
{
$(form).ajaxSubmit();
}
})

submitHandler:通过验证后运行的函数,里面要加上表单提交的函数,否则表单不会提交。
$(".selector").validate({
  submitHandler:function(form) {
    $(form).ajaxSubmit();
  }
})

更改错误信息显示的位置
errorPlacement:Callback
指明错误放置的位置,默认情况是:error.appendTo(element.parent());即把错误信息放在验证的元素后面。

errorPlacement: function(error, element) {
  error.appendTo(element.parent());
}

validate ()的可选项

debug:进行调试模式(表单不提交)。

$().ready(function() {
$("#signupForm").validate({
debug:true
});
});

submitHandler:通过验证后运行的函数,里面要加上表单提交的函数,否则表单不会提交。

$(".selector").validate({
submitHandler:function(form) {
$(form).ajaxSubmit();
}
})

OnSubmit:类型 Boolean,默认 true,指定是否提交时验证。

$(".selector").validate({
onsubmit:false
})

onfocusout:类型 Boolean,默认 true,指定是否在获取焦点时验证。

$(".selector").validate({
onfocusout:false
})

onkeyup:类型 Boolean,默认 true,指定是否在敲击键盘时验证。

$(".selector").validate({
onkeyup:false
})

onclick:类型 Boolean,默认 true,指定是否在鼠标点击时验证(一般验证 checkbox、radiobox)。

$(".selector").validate({
onclick:false
})

focusInvalid:类型 Boolean,默认 true。提交表单后,未通过验证的表单(第一个或提交之前获得焦点的未通过验证的表单)会获得焦点。

$(".selector").validate({
focusInvalid:false
})

focusCleanup:类型 Boolean,默认 false。当未通过验证的元素获得焦点时,移除错误提示(避免和 focusInvalid 一起使用)。

$(".selector").validate({
focusCleanup:true
})

jquery validate基本的更多相关文章

  1. jQuery Validate 表单验证 — 用户注册简单应用

    相信很多coder在表单验证这块都是自己写验证规则的,今天我们用jQuery Validate这款前端验证利器来写一个简单的应用. 可以先把我写的这个小demo运行试下,先睹为快.猛戳链接--> ...

  2. jquery validate表单验证插件-推荐

    1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家.     1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素  3.鼠标离开后的正确.错误提示及鼠标移入时的帮 ...

  3. 修改 jquery.validate.js 支持非form标签

    尝试使用markdown来写一篇blog,啦啦啦 源代码传送门:github 在特殊情况下我们使用jquery.validate.js对用户输入的内容做验证的时候,表单并不是一定包含在form之中,有 ...

  4. 表单验证插件之jquery.validate.js

    提到表单验证的插件,第一个想到的就是jquery.validate.js,所以小生想在这里稍微详细地说一下这款插件的具体使用方法,便于理解,我直接附上整段demo的代码(没怎么调样式,主要是看js): ...

  5. Jquery客户端校验——jquery.validate.js

    jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证 ...

  6. jquery.validate不用submit而用js提交的例子

    $("#form").validate(); $("#btn).click(function(){ if($("#form").valid()){ $ ...

  7. ASP.NET MVC 5 Jquery Validate

    ClientValidationEnabled 在asp.net mvc 5中ClientValidationEnabled默认为TRUE,所以也不需要刻意去设置 应用ValidationAttrib ...

  8. jQuery Validate验证框架详解

    转自:http://www.cnblogs.com/linjiqin/p/3431835.html jQuery校验官网地址:http://bassistance.de/jquery-plugins/ ...

  9. JS验证控件jQuery Validate

    jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证 ...

  10. 利用jquery.validate以及bootstrap的tooltip开发气泡式的表单校验组件

    表单校验是页面开发中非常常见的一类需求,相信每个前端开发人员都有这方面的经验.网上有很多成熟的表单校验框架,虽然按照它们默认的设计,用起来没有多大的问题,但是在实际工作中,表单校验有可能有比较复杂的个 ...

随机推荐

  1. 限制属性绑定(__slots__)

    正常情况下,当定义了一个class并创建实例后,可以给该实例绑定任何属性和方法,这就是动态语言的灵活性 属性和方法是可以直接定义在class中的,但动态绑定允许在程序运行的过程中动态给class加上属 ...

  2. EditPlus 3:设置自动换行

    打开软件,菜单栏点击Document,再在下拉栏中点击Permanent Settings,然后在弹出的设置框中找到Word Wrap点击,最后在弹出的小框中勾选第一个Enable word wrap ...

  3. 跟我一起玩Win32开发(2):完整的开发流程

    上一篇中我给各位说了一般人认为C++中较为难的东西——指针.其实对于C++,难点当然不局限在指针这玩意儿上,还有一些有趣的概念,如模板类.虚基类.纯虚函数等,这些都是概念性的东西,几乎每一本C++书上 ...

  4. Homebrew 常用命令

    Homebrew 常用命令 Homebrew 介绍 Homebrew也称brew,macOS下基于命令行的最强大软件包管理工具,使用Ruby语言开发.类似于CentOS的yum或者Ubuntu的apt ...

  5. AtCoder Grand Contest 010 F - Tree Game

    题目传送门:https://agc010.contest.atcoder.jp/tasks/agc010_f 题目大意: 给定一棵树,每个节点上有\(a_i\)个石子,某个节点上有一个棋子,两人轮流操 ...

  6. Maximal Area Quadrilateral CodeForces - 340B || 三点坐标求三角形面积

    Maximal Area Quadrilateral CodeForces - 340B 三点坐标求三角形面积(可以带正负,表示向量/点的不同相对位置): http://www.cnblogs.com ...

  7. python中的sort和sorted

    共同点 都有三个参数, cmp用户自定义(指定函数),每个元素都会调用,效率没key高 key带一个参数的函数,用来为每个元素提取比较值 reverse=True    翻转 sort sort作用的 ...

  8. 外文翻译 《How we decide》被情感愚弄 第二节

    本节阅读感言:我们在遭受损失后,很容易破罐子破摔,做出更糟糕的决定. 书的导言 本章第一节 情感系统的缺陷会产生很重要的影响.想一想股票市场,一个典型的随机系统的例子.短期的波动无法给未来长期的股市情 ...

  9. 如何从GAC中拷贝文件出来 C:\Windows\assembly

    方法一:命令行拷贝. 开始--运行--cmd--"cd C:\WINDOWS\assembly".一般自己开发的dll都在GAC_MSIL这个文件夹下面,按照我如下的截图就可以拷贝 ...

  10. Java_面向对象中的this和super用法

    this: 1.使用在类中,可以用来修饰属性.方法.构造器 2.表示当前对象或者是当前正在创建的对象 3.当形参与成员变量重名时,如果在方法内部需要使用成员变量,必须添加 this 来表明该变量时类成 ...