JQuery验证消息仅在多次提交后显示

我正在尝试使用 jquery-validate插件验证表单.在我单击提交两次之前,html页面不会显示验证中的错误消息.我知道每次点击(包括第一次)都会收到提交事件,因为我在 javascript中发出警报以进行验证.

我还可以看到表单已提交,因为我看到第一次单击后参数栏中显示的参数.我是否必须做些什么来强制第一次显示错误消息？

我在这里如何添加验证：

<script type="text/javascript">
$("form").submit(function() {
    $("form").validate({
        rules: {
            match: "required",limit: "required"
        },messages: {
            match: "Please enter a match"
        },});
});
</script>

Here is a snippet of my form:

<form action="#">
  <fieldset>
    <legend>Smart Playlist</legend>
    <div class="control-group">
      <label class="control-label">
      <input type="checkBox" name="match" value="match" class="chkBox"/>
      </label>
   </div>
  </fieldset>
</form>

解决方法

您不需要将它包含在.submit()处理程序中,因为 Validation Plugin已经处理了这个问题.有关工作示例,请参阅 official demo page.

$(document).ready(function() {

    $("form").validate({
        rules: {
            match: "required",messages: {
            match: "Please enter a match"
        } // <- removed trailing comma
    });

});

顺便说一句,你在消息后面还有一个逗号：选项.某些版本的IE会扼杀它.这是“Trailing Comma of Death”,它只影响某些版本的IE …其他浏览器的工具可能不会将其标记为错误,因为它在技术上不是错误.

更详细地解释发生了什么：

由于您在.submit()中包含.validate(),因此在您点击提交之前,验证函数甚至不会加载.由于在您点击提交时尚未加载,因此不会进行验证.然后,当您第二次点击提交时,该功能现在已加载,因此它似乎正常工作.

当你在document.ready中包含.validate()时,Validation插件会在DOM加载完成后立即加载.因此,它已准备好并等待您与表单进行交互,并且在第一次提交时它的行为正确.