带有 display:none 表单元素的 jquery 验证器插件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12308138/
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
jquery validator plugin with display:none form elements
提问by dSquared
I'm using the validator plugin found hereto validate a form.
我正在使用此处找到的验证器插件来验证表单。
Problem I'm having is if I put the following around a form input element the validation fails:
我遇到的问题是，如果我将以下内容放在表单输入元素周围，验证将失败：
<div style="display:none;"><input type="text" name="test" /></div>
I need this because I'm using other UI control layers for the input elements and don't want them visible.
我需要这个，因为我正在为输入元素使用其他 UI 控制层，并且不希望它们可见。
It works on inline and block elements, but I need it to be hidden. Is there anyway to get around this?
它适用于内联和块元素，但我需要将其隐藏。有没有办法解决这个问题？
Thanks for any feedback
感谢您的任何反馈
Update:
更新：
I'm mostly validating select option fields, with django (ie: {{form.select_option_element}} )
我主要使用 django 验证选择选项字段（即： {{form.select_option_element}} ）
So effectively:
如此有效：
<div style="display:none;">
{{form.select_option_element}}
</div>
...doesn't work
...不起作用
Right after posting I seem to solve it with:
发布后我似乎解决了它：
<div style="visibility: hidden; height: 0;">
{{form.select_option_element}}
</div>
It then allows me to validate the field.
然后它允许我验证该字段。
回答by dSquared
From the 1.9.0 Change Log of jQuery Validate:
来自jQuery Validate的 1.9.0 更改日志：
- Fixed #189 - :hidden elements are now ignored by default
- 固定 #189 - ：隐藏元素现在默认被忽略
To turn it back on simply do the following:
要重新打开它，只需执行以下操作：
$(document).ready(function(){
$.validator.setDefaults({
ignore: []
});
});
Make sure that this appears beforeyou call the actual validation plugin in your code.
在您调用代码中的实际验证插件之前，请确保它出现。
I hope this helps!
我希望这有帮助！
回答by vladimir
I like the answer of @dSquared but unfortunately 'ignore'-property will be reseted for every form's validator on page. In some cases it doesnt need.
我喜欢@dSquared 的答案，但不幸的是，页面上每个表单的验证器都会重置“忽略”属性。在某些情况下它不需要。
I use this way:
我用这种方式：
$(document).ready(function () {
var $form = $("#some-form");
$form.validate().settings.ignore = []; // ! Say to validator dont ignore hidden-elements on concrete form.
$('#button-send').click(function () {
if ($form.valid()) { .. }
});
// !! apply plugin's initializers which will hide origin elements (it can be CLEditor or Choosen plugins)
});
回答by rafiki_rafi
Have you tried adding the style attribute to the input element? So instead of wrapping it with a div, try:
您是否尝试将 style 属性添加到 input 元素？因此，不要用div包装它，而是尝试：
<input type="text" name="test" value="" style="display: none;" />
回答by prakashpoudel
There are two things you can do.
你可以做两件事。
1) you can statically set value, which does not fail validation, for this input field like
1）您可以静态设置值，该值不会使验证失败，对于此输入字段，例如
<div style="display:none;"><input type="text" name="test" value="default" /></div>
2) If you want to neglate this value in your validation method.
2）如果你想在你的验证方法中否定这个值。
I would appreciate if you could provide more detail code.
如果您能提供更详细的代码，我将不胜感激。
回答by Caike Bispo
Another form to solve this problem is changing the display: noneto visibility: hidden.
解决此问题的另一种形式是将 更改display: none为visibility: hidden。
Eg: <input type="text" name="test" value="" style="visibility: hidden;" />
例如： <input type="text" name="test" value="" style="visibility: hidden;" />
