Javascript 使用 jQuery 验证插件：onfocusout、onkeyup 在生产站点上没有按预期工作
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7786021/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Using jQuery validate plugin: onfocusout, onkeyup notworking as expected on production site
提问by Chantz
I am using jQuery Validate pluginv.1.9.0 it works very nicely. But I am facing this issue, once the user submits the form & if there are any errors, it correctly display error message. The problem is that it does not update the message if the user takes an action to remedy that error. E.g. if a field is required, upon getting the message the first time, user starts typing, then that message should go away.
我正在使用jQuery Validate 插件v.1.9.0 它工作得很好。但我面临这个问题，一旦用户提交表单，如果有任何错误，它会正确显示错误消息。问题在于，如果用户采取措施纠正该错误，它不会更新消息。例如，如果需要某个字段，则在第一次收到消息时，用户开始输入，然后该消息应该消失。
In the docs it mentions that onfocusout& onkeyupare used for this purpose & by default they are set to true. The funny thing is it seems to work on my local workstation but it fails (silently) once I upload my code to production site. I thought I was messing it up royally somehow so I fired up jsfiddle and put relevant codeto see if it happens there as well.
在文档中，它提到onfocusout和onkeyup用于此目的，默认情况下它们设置为 true。有趣的是，它似乎可以在我的本地工作站上运行，但是一旦我将代码上传到生产站点，它就会（无声地）失败。我以为我以某种方式把它搞砸了，所以我启动了jsfiddle 并放置了相关的代码，看看它是否也发生在那里。
I was amazed to see it happens there as well. So my question is why does it work on my local machine but not on production sites?
我很惊讶地看到它也在那里发生。所以我的问题是为什么它可以在我的本地机器上运行而不是在生产站点上运行？
P.S. Self-contained example at http://jsfiddle.net/tankchintan/cge44/5/
PS 自包含示例在http://jsfiddle.net/tankchintan/cge44/5/
UPDATE
更新
To replicate the issue, do -
要复制该问题，请执行-
- Go to the jsfiddle page.
- Without filling out any fields hit submit the form.
- It will show error message besides each field.
- Now start typing in any one of the fields.
- You will notice that the error message doesnt go away, even though the rule is satisfied. On my local machine that error mesaage does go away, once I type anything in the field.
- 转到 jsfiddle 页面。
- 无需填写任何字段点击提交表单。
- 除了每个字段，它还会显示错误消息。
- 现在开始输入任何一个字段。
- 您会注意到，即使满足规则，错误消息也不会消失。在我的本地机器上，一旦我在字段中输入任何内容，错误消息就会消失。
采纳答案by nuander
This problem even exists in some of the examples on the JQuery website.
这个问题甚至在JQuery网站的一些例子中也存在。
I found that the problem occurs when the input element has no type. Web browsers assume that the type is "text" if not specified, but jquery.validate has a problem with that. Your input element should look like this:
我发现当输入元素没有类型时会出现问题。如果未指定，Web 浏览器会假定类型为“文本”，但 jquery.validate 对此存在问题。您的输入元素应如下所示：
<input id="cname" name="name" type="text" class="required" minlength="2" />
回答by user1893029
Use this instead!
用这个代替！
onkeyup: function(element) { $(element).valid(); },
onfocusout: function(element) { $(element).valid(); },
回答by Sam Barnum
Apparently this doesn't work if your jQuery library is too new. I was experiencing the same thing, rolling back from jquery v1.7.2 to v1.3.2 fixed the problem.
显然，如果您的 jQuery 库太新，这将不起作用。我遇到了同样的事情，从 jquery v1.7.2 回滚到 v1.3.2 解决了这个问题。
The example page at http://jquery.bassistance.de/validate/demo/uses 1.3.2, but I'm not sure which specific version of jquery this breakage occurred in.
http://jquery.bassistance.de/validate/demo/ 上的示例页面使用 1.3.2，但我不确定此损坏发生在哪个特定版本的 jquery。
回答by mixja
The following works for me:
以下对我有用：
$(document).ready(function () {
$("#myFormElement").submit(function (event) {
var validator = $.data($('form')[0], 'validator');
validator.settings.onfocusout = function (element) { $(element).valid(); };
validator.settings.onkeyup = function (element) { $(element).valid(); };
});
var validator = $.data($('form')[0], 'validator');
validator.settings.onfocusout = false;
validator.settings.onkeyup = false;
});
This disables initial onkeyup validation. If the user then clicks submit, we re-enable validation so that once the field is valid, he/she is given immediate feedback.
这将禁用初始 onkeyup 验证。如果用户然后单击提交，我们会重新启用验证，以便一旦该字段有效，他/她就会立即得到反馈。
I'm not sure why these properties are boolean initially and then callbacks on the submit event. I only found the method by setting the properties to true in the submit event, which caused an exception in the validation library (was attempting the call function).
我不确定为什么这些属性最初是布尔值，然后在提交事件上回调。我只是通过在提交事件中将属性设置为 true 来找到该方法，这导致验证库中出现异常（正在尝试调用函数）。
回答by agtb
I think the default behaviour is to only hide that message when the field validates e.g. 'Please enter a valid email address' disappears after you enter '[email protected]', which I think makes sense.
我认为默认行为是仅在字段验证时隐藏该消息，例如在输入“[email protected]”后“请输入有效的电子邮件地址”消失，我认为这是有道理的。
See demos: http://jquery.bassistance.de/validate/demo/
见演示：http: //jquery.bassistance.de/validate/demo/
I think you might be trying to do something similar to this: jquery validate: focusCleanup: true and focusInvalid: false don't work as expected
我认为您可能正在尝试执行与此类似的操作：jquery validate: focusCleanup: true 和 focusInvalid: false don't work as expected
