我的一些表单需要验证,为此我使用了JQuery验证插件。
我的一些表单需要一个自定义的提交处理程序(在提交前有条件地弹出一个确认对话框,与验证无关)。我将处理程序附加到表单上,如下所示:
function confirmHandlerAttach(form, handler) {
$(form).off("submit", confirmHandlerDefault);
$(form).on("submit", handler);
}
验证和提交处理程序都是基于类附加在docready上的。独立地,两者都工作良好。问题是,不管验证是否成功,表单的提交处理程序似乎都会被调用。请看一个简单的例子here。
这不是我所期望的。我认为验证会阻止提交和提交处理程序的运行。是我做错了什么,还是我的期望错了?
我意识到我可以使用验证的submitHandler属性,如果必要的话,我将使用该方法。但是,由于验证和确认(或任何其他提交处理程序)是真正独立的函数,因此必须更改所有表单提交处理程序来处理JQuery验证插件似乎是一种耻辱,以防某些表单使用验证。
1条答案
按热度按时间ff29svar1#
您的jsFiddle:http://jsfiddle.net/sferrari63/VGj2R/
每次单击提交按钮时,
submit
处理程序都会触发,即使表单是“无效”的。引用OP:
这不是我所期望的。我认为验证会阻止提交和提交处理程序的运行。“是我做错了什么,还是我的期望错了?”**
你在做一些不必要的事情,你的期望是错误的。仅仅因为jQuery Validate插件阻止了默认的提交操作,并不意味着任何外部提交处理程序都不会被触发。
这就是为什么开发人员给你
submitHandler
和invalidHandler
回调函数的原因。由于插件会自动阻止默认提交,因此这些回调函数取代了您创建自己的submit
处理程序的需要。submitHandler
仅在表单“有效”时单击提交按钮时触发。invalidHandler
仅在表单“invalid”的情况下,在单击submit按钮时触发。(Note:如果你的提交按钮包含
class="cancel"
,表单将总是评估为“有效”,并且submitHandler
将总是触发...所有规则都将被忽略。编辑*:class="cancel"
已被弃用,转而支持formnovalidate="formnovalidate"
属性。如果出于某种奇怪的原因,您需要这个额外的
submit
处理程序,您可以使用.valid()
方法测试表单。虽然,我不建议这样做,当你已经有完美的submit
处理内置到插件。DEMO:http://jsfiddle.net/VGj2R/1/
由于插件正在处理
submit
事件,因此在按钮的click
处理程序上触发下面的代码会更正确。DEMO:http://jsfiddle.net/VGj2R/2/
但是,除非您的表单没有提交按钮,否则上面的代码是不必要的,可以使用
submitHandler
回调函数。