最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
jQuery validate 插件验证表单使用例子
时间:2014-03-04 编辑:简简单单 来源:一聚教程网
之前曾用过jQuery validator做过一些项目,但是最近又重新拾起,发现功能上升级了,一些之前的使用方法已经在报错了,于是乎再重新整理一篇博客汇总一下最新的jQuery form validate 使用教程。
jQuery validate 使用方法
其中我们经常要用户表单提交事件,表单元素失去焦点后的验证事件,错误显示的方法,验证表单rules规则,验证表单rules规则对应的消息。
代码如下 | 复制代码 |
jQuery(document).ready(function ($) { errorPlacement: function (error, element) { // validation rules |
其他使用方法请查看官方API函数。
jQuery validate submitHandler 导致死循环
防止表单提交死循环,应该用form.submit();而非$(form).submit();
submitHandler的form变量为dom,dom对象转换成jquery的对象,加上$()这个就行,然后就可以用jquery的语法来操作。
正确的使用提交表单方法:
代码如下 | 复制代码 |
submitHandler: function(form){ |
这样就对了。
jQuery validate Ajax Submit
我们可以定义submitHandler函数中使用jQuery Ajax来请求处理。
代码如下 | 复制代码 |
$("#user-login").validate({ // custom handler to call named function "do_payment" submitHandler: function (form) { $.ajax({ type: "POST", url: '/ajax/user/login', data: {"name" : $(form).find('#edit-name').val(), "pass" : $(form).find('#edit-pass').val() }, dataType: "json", success: function(data) { if (data.result) { location.reload(); } else if(data.message) { alert(data.message); } else { alert('密码错误'); } } }); }, // validate the previously selected element when the user clicks out onfocusout: function (element) { $(element).valid(); }, errorPlacement: function (error, element) { error.appendTo(element.parent()); } }); |
最后不得不感谢以下jQuery Validate插件作者。
-
上一个: Ember.js 表单验证的使用例子
-
下一个: wordpress屏蔽垃圾评论的方法
相关文章
- jquery validate表单验证插件的使用例子及详解 08-12
- jquery表单验证控件:Form-Validate例子 01-23
- Jquery表单验证插件Validate开发应用例子 05-03
- jQuery validate 表单验证使用方法 04-19
- HTML简单购物数量小程序代码展示 10-31
- html canvas实现弹幕功能 10-31