javascript jQuery 验证插件忽略的元素得到验证
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24554332/
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 Validation plugin ignored elements get validated
提问by davidf
I validate a form with tje jQuery Validation Plugin. If the browser supports the HTML5 datetime-local element I want that input not to be validated. Everything works fine, except that the elements with the ignore class still get validated.
我使用 tje jQuery Validation Plugin 验证表单。如果浏览器支持 HTML5 datetime-local 元素，我希望该输入不被验证。一切正常，除了带有 ignore 类的元素仍然得到验证。
HTML in Chrome (with datetime-local support)
Chrome 中的 HTML（具有日期时间本地支持）
<form action="/Events/EditEventInfo/37" id="EditForm" method="post" novalidate="novalidate"><input name="__RequestVerificationToken" type="hidden" value="bg5O93sGSgPSWzzsaMfKzd0FPWddBBw9ZYC4srs5xBWmJgsBKWjmD2TL0OXyQNwGl1fa7orAp08pCL1RLxzlSdbNWc9YUxxd1rxGrpw0fhgINRnd3vXoCzG5bDhe2ySk77kXfCfyEJvy-uvYRIbA8Q2"> <div class="form-horizontal">
<div class="form-group">
<label for="StartDate" class="control-label col-md-2">Startdatum</label>
<div class="col-md-10">
<input id="StartDate" name="StartDate" class="form-control ignore error" type="datetime-local" required="" aria-required="true" aria-invalid="true"><label id="StartDate-error" class="error" for="StartDate">Bitte geben sie ein Datum im Format 'dd.MM.yyyy HH:mm' an.</label>
</div>
</div>
<div class="form-group">
<label for="EndDate" class="control-label col-md-2">Enddatum</label>
<div class="col-md-10">
<input id="EndDate" name="EndDate" class="form-control ignore error" type="datetime-local" required="" aria-required="true"><label id="EndDate-error" class="error" for="EndDate">Bitte geben sie ein Datum im Format 'dd.MM.yyyy HH:mm' an.</label>
</div>
</div>
<div class="form-group">
<label for="Name" class="control-label col-md-2">Name</label>
<div class="col-md-10">
<input id="Name" name="Name" class="form-control valid" value="Party. Yolo." type="text" minlength="2" required="" aria-required="true">
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Speichern" class="btn btn-default">
</div>
</div>
</div>
Script:
脚本：
<script type="text/javascript">
$.validator.addMethod(
"deDateTime",
function (value, element) {
//dd.MM.yyyy HH:mm
var re = /^\d{2}\.\d{2}\.\d{4} \d{2}:\d{2}$/;
return (this.optional(element) && value == "") || re.test(value);
},
"Bitte geben sie ein Datum im Format 'dd.MM.yyyy HH:mm' an."
);
if (DateTimeLocalSupport())
{
$('#StartDate').val("@Model.StartDate.ToString("s")");
$('#EndDate').val("@Model.EndDate.ToString("s")");
//HTML5 input types are available, no need to validate those fields
$('#StartDate').addClass("ignore");
$('#EndDate').addClass("ignore");
}
else
{
$('#StartDate').val("@Model.StartDate.ToString("dd.MM.yyyy HH:mm")");
$('#EndDate').val("@Model.EndDate.ToString("dd.MM.yyyy HH:mm")");
}
$('#EditForm').validate({
ignore: ".ignore :hidden",
rules: {
StartDate: {
deDateTime: true
},
EndDate: {
deDateTime: true
}
}
});
alert("Valid: " + $('#EditForm').valid());
</script>
Checking for HTML5 support, populating the fields and adding classes works fine. Only does the validation plugin still validate the elements its not supposed to.
检查 HTML5 支持、填充字段和添加类工作正常。只有验证插件仍然验证它不应该验证的元素。
Solution:
解决方案：
ignore: '.ignore, :hidden'
回答by Sparky
ignore: ".ignore :hidden"is telling it to ignore hiddenfields with the class ignore.
ignore: ".ignore :hidden"告诉它忽略类的隐藏字段ignore。
ignore: ".ignore"will tell it to only ignore fields will class .ignore.
ignore: ".ignore"会告诉它只忽略字段将类.ignore。
ignore: ".ignore, :hidden"will tell it to ignore fields will class .ignoreAND fields that are hidden.
ignore: ".ignore, :hidden"会告诉它忽略字段将对.ignore隐藏的字段进行分类。
Without specifying the ignoreoption at all, the default is ignore: ":hidden"where it will only ignore hidden fields.
ignore根本不指定选项，默认情况ignore: ":hidden"下它只会忽略隐藏字段。
Setting to ignore: []tells the plugin to ignore nothing and validate everything.
设置为ignore: []告诉插件忽略任何内容并验证所有内容。
