在validate中,ignore配置項(xiàng)為忽略配置的表單元素,查找源碼得知,ignore默認(rèn)值為":hidden"
$.extend( $.validator, {
...,
ignore: ":hidden",
...
})
意思是默認(rèn)忽略隱藏的表單元素。
一開始我認(rèn)為是帶有hidden屬性的元素才隱藏,但后面發(fā)現(xiàn),元素的display: none也是被認(rèn)為是hidden的。
驗(yàn)證如下:
//默認(rèn)已引入jquery
<div id="demo" style="display:none;"></div>
console.log($('#demo').is(':hidden')); //true
那如何才能讓validate可以驗(yàn)證到隱藏的表單元素?很自然的能想到,配置成空。
$('#demoForm').validate({
ignore: '',
rules: {
'title': { required: true },
}
});
確實(shí)能夠起效,但是會(huì)引出一個(gè)問題。
<form id="demoForm">
<input type="file" accept=".xls" hidden />
<input type="text" name="title" />
</form>
$('#demoForm').validate({
ignore: '',
rules: {
'title': { required: true },
}
});
最后會(huì)發(fā)現(xiàn),表單提交不了,而且會(huì)觸發(fā)一個(gè)錯(cuò)誤Please enter a value with a valid mimetype.
查找源碼發(fā)現(xiàn),在file類型的表單元素,使用了accept屬性,validate會(huì)驗(yàn)證你選擇上傳的文件格式是否你指定的那些(xls等)。
這樣想好像也沒問題,但是事實(shí)上我選擇的文件格式 和 它獲取到的文件格式 還真是不一樣。
最后建議改成:
$('#demoForm').validate({
ignore: '[type="file"]',
rules: {
'title': { required: true },
}
});
或者 去掉file的accept屬性