本文介绍了jQuery验证插件-行为异常的“必需"规则的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用 jQuery验证插件( jquery-validate )的问题,我已经用它制作了5种表格&痛苦很多.

I'm using this jQuery Validation Plugin (jquery-validate) in combination with Bootstrap, and I already made 5 forms with it & with a lot of pain.

我现在有这个 JSFiddle ,但是我的密码字段的行为很奇怪...
如您所见,我为所有密码设置了required规则.如果我删除浏览器中的所有项目符号并移至下一个字段,则将其保持不变,如果已将其标记为正确,则它将保持正确,如果根本没有标记,则将保持未标记. 它没有被标记为不正确,并且错误消息没有显示!

I now have this JSFiddle, but my password field is behaving strangely...
As you can see, I set the required rule for the password, as for all. If I delete all bullets in my browser and move on to the next field, it is left untouched, if already marked correct, it remains correct, if not marked at all, remains unmarked. It isn't marked incorrect, and the error message does not show up!

我只能通过首先在密码字段上产生minlength错误,然后然后删除所有字符(或required规则错误消息>单击提交按钮(仅在所有字段均未处于错误状态时才可用).

I can only get my required rule error message to show up by first producing the minlength error on the password field, and then removing all characters, or by clicking the submit button (only available if all fields aren't in an error state).

经过大量检查,我发现了onfocusout选项.可以为truefalse,默认设置为true如网站所述,

After a lot of checking, I found the onfocusout option. This can be either true or false, with the default set to true As the website states,

我想这肯定是原因.但是经过大量的谷歌搜索,结果发现没有其他人遇到这个问题(或者至少是由于onfocusout规则造成的).一篇文章确实提到"required规则是一个例外"(对于onfocusout规则?).

This would surely be the cause, I thought. But after a lot of googling, it turned out no one else had that problem (or at least, due to the onfocusout rule). One post did mention that "the required rule is an exception" (to the onfocusout rule?).

底线 :我无法获得我的required规则错误,但提交或首次生成错误消息. 然后,它确实会显示.
结论 :可能会产生错误,但不会出现在blur上.
问题 :如何解决?

Bottom line: I cannot get my required rule error to work, with the exception when submitting or first producing the minlength error message. Then, it does show up.
Conclusion: The error can be produced, but not on blur.
Question: How to fix this?

我的密码输入字段

<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,对所有内容进行了三重检查,但仍然找不到该错误...


I added console.log messages upon when the error should've been placed - not even called. I validated my code and HTML, triple-checked everything, but I still can't find the bug...

推荐答案

引用OP:

这不是错误.这称为惰性"验证,这是默认行为.

This is not a bug. This is called "Lazy" validation and it's the default behavior.

文档:

引用OP:

不完全是. onfocusout默认为 active ;您不能在不破坏插件的情况下将其设置为true.您只能将其设置为false(以将其禁用),也可以使用自己的功能将其覆盖.

Not quite. onfocusout is active by default; you cannot set it to true without breaking the plugin. You can only set it to false (to disable it) OR you can over-ride it with your own function.

文档:

修改onfocusout回调选项以进行更多急切"验证,以便所有验证在离开该字段后立即触发.

Modify the onfocusout callback option for more "Eager" validation, so that all validation triggers immediately upon leaving the field.

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

演示: jsfiddle.net/p4K7S/

DEMO: jsfiddle.net/p4K7S/

要获得更完整的渴望"验证体验,请对onkeyup回调函数执行相同的操作,一旦在字段中键入内容,验证就会立即开始.

For a more complete "Eager" validation experience, do the same for the onkeyup callback function and validation will commence as soon as typing starts inside a field.

$('#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/

DEMO 2: jsfiddle.net/em0uspk3/

为什么使用onkeyup时仍需要onfocusout?因为在用户与单选,复选框和选择元素进行交互期间没有按键事件.

Why would you still need onfocusout when using onkeyup? Because there are no keyup events during user interactions with radio, checkbox, and select elements.

这篇关于jQuery验证插件-行为异常的“必需"规则的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-25 17:03