jQuery验证消息仅在多次提交后显示 [英] JQuery validation messages only show up after multiple submits

问题描述

我正在尝试使用jquery-validate插件验证表单.直到我单击两次提交，HTML页面才会显示来自验证的错误消息.我知道每次点击(包括第一次点击)都会收到一次提交事件，因为我在javascript中放置了警报以进行验证.

I am trying to validate a form with the jquery-validate plugin. The html page doesn't show the error messages from the validation until I click submit twice. I know the submit event is being received on every click (including the first one) because I placed an alert in the javascript to verify.

我还可以看到表单已提交，因为在第一次单击后，我看到参数显示在地址栏中.我需要做些什么来强制错误消息第一次出现吗?

I can also see the form is submitted because I see the parameters show up in the address bar after the first click. Do I have to do something to force the error messages to show up the first time?

这是我添加验证的方式:

Here how I'm adding the validation:

<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>

推荐答案

由于官方演示页面.

You do not need to enclose it within the .submit() handler because the Validation Plugin takes care of that already. Please refer to the official demo page for working examples.

$(document).ready(function() {

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

});

顺便说一句-在messages:选项之后，您也有一个逗号结尾.某些版本的IE会令人窒息.这是 死亡逗号" ，它仅会影响IE的某些版本...其他浏览器的工具可能不会将其标记为错误，因为从技术上讲，它不是错误.

BTW- you also had a trailing comma after the messages: options. Certain versions of IE would choke on that. This is the "Trailing Comma of Death" and it only affects certain versions of IE... other browsers' tools may not flag it as an error because it's technically not an error.

对正在发生的事情的更详细的解释:

A more detailed explanation of what was happening:

由于您将.validate()括在.submit()内，因此直到您单击提交"后，验证功能才会加载.由于在您单击提交"时尚未加载该文件，因此不会进行任何验证.然后，当您第二次单击提交时，该功能现在已加载，因此它似乎可以正常工作.

Since you enclosed .validate() within .submit(), the Validation function does not even load until you hit submit. Since it's not already loaded when you hit submit, no validation will occur. Then when you hit submit the second time, the function is now loaded so it appears to work normally.

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

When you enclose .validate() within document.ready, the Validation plugin loads immediately as the DOM is finished loaded. Therefore, it's ready and waiting for you to interact with your form and it behaves correctly on the first submit.

这篇关于jQuery验证消息仅在多次提交后显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！