jQuery Validation Plugin - '必需' 规则行为异常

Question

我正在将这个 jQuery Validation Plugin (jquery-validate) 与 Bootstrap 结合使用，我已经用它制作了 5 个表单并且非常痛苦。

我现在有了这个JSFiddle，但我的密码字段表现得很奇怪...
如您所见，我为密码设置了required 规则，就像所有一样。如果我删除浏览器中的所有项目符号并移至下一个字段，则保持不变，如果已标记为正确，则保持正确，如果根本未标记，则保持未标记。 没有标记不正确，也没有显示错误信息！

我只能通过首先在密码字段中生成minlength 错误，然后然后删除所有字符，或来显示我的required 规则错误消息> 通过单击提交按钮（仅在所有字段均未处于错误状态时可用）。

经过大量检查，我找到了onfocusout 选项。这可以是true 或false，默认设置为true 如网站所述，

[It] 在模糊时验证 [s] 元素（复选框/单选按钮除外）。如果未输入任何内容，则跳过所有规则，除非该字段已被标记为无效。

这肯定是原因，我想。但是经过大量的谷歌搜索，结果证明没有其他人有这个问题（或者至少，由于onfocusout 规则）。一篇文章确实提到“required 规则是一个例外”（onfocusout 规则？）。

---

底线：我的required 规则错误无法正常工作，提交或首次生成@987654337 时例外@ 错误信息。 然后，它确实出现了。
结论：可以产生错误，但不会在blur上产生。
问题：如何解决这个问题？

---

我的密码输入栏

<input type="password" class="form-control" id="passw" name="passw" value="nochange" maxlength="20" required="required" placeholder="123456789" />

我的密码规则

passw: {
    required: true,
    minlength: 5,
    maxlength: 20
},

---

我在应该放置错误时添加了console.log 消息 - 甚至没有调用。我验证了我的代码和 HTML，对所有内容进行了三重检查，但仍然找不到错误...

Answer 1

引用 OP：

“我无法让我需要的规则错误起作用，提交或第一次生成 minlength 错误消息时例外。然后，它确实出现了......我验证了我的代码和 HTML，对所有内容进行了三重检查，但我仍然找不到错误”

这不是错误。这称为“惰性”验证，它是默认行为。

Documentation：

“在一个字段被标记为无效之前，验证是懒惰的：在第一次提交表单之前，用户可以在字段之间切换而不会收到烦人的消息——他们在有机会之前不会被 bug实际输入一个正确的值......它旨在提供不显眼的用户体验，尽可能少地用不必要的错误消息打扰用户”

引用 OP：

“经过大量检查，我找到了onfocusout选项。这可以是true或false，默认设置为true，如网站所述”

不完全是。 onfocusout 默认为活动；你不能在不破坏插件的情况下将其设置为true。您只能将其设置为 false（禁用它）或者您可以使用自己的函数覆盖它。

Documentation：

“设置为函数以自行决定何时运行验证。布尔值 true 不是有效值。”

修改onfocusout 回调选项以获得更多“渴望”验证，以便在离开现场时立即触发所有验证。

$('#yourform').validate({
    // your rules & options,
    onfocusout: function (element, event) {
        this.element(element);  // eager validation
    }
});

演示：jsfiddle.net/p4K7S/

要获得更完整的“急切”验证体验，请对 onkeyup 回调函数执行相同操作，一旦在字段中开始输入，验证就会开始。

$('#yourform').validate({
    // your rules & options,
    onfocusout: function (element, event) {
        this.element(element);  // eager validation
    },
    onkeyup: function (element, event) {
        this.element(element);  // eager validation
    }
});

演示 2：jsfiddle.net/em0uspk3/

为什么在使用onkeyup 时仍然需要onfocusout？因为在用户与单选、复选框和选择元素交互期间没有按键事件。