jquery validate基本
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 })