我有一个带有几个按钮的表单,我正在使用来自http://jquery.bassistance.de/validate/ 的jQuery 验证插件。我只想知道是否有任何方法可以检查我的 javascript 代码中的任何位置的 jquery 验证插件是否认为表单处于有效状态。
如何使用 jQuery 验证插件以编程方式检查表单是否有效
IT技术
javascript
jquery
jquery-validate
2021-03-19 18:55:15
6个回答
使用.valid()
从jQuery验证插件:
$("#form_id").valid();
检查选定的表单是否有效或是否所有选定的元素都有效。在使用此方法检查表单之前,需要在表单上调用validate()。
其中表单 withid='form_id'
是一个已经.validate()
调用过它的表单。
2015 年答案:我们在现代浏览器上开箱即用,只需使用jQuery的HTML5 CheckValidity API。我还制作了一个jquery-html5-validity module来做到这一点:
npm install jquery-html5-validity
然后:
var $ = require('jquery')
require("jquery-html5-validity")($);
然后你可以运行:
$('.some-class').isValid()
true
@mikemaccana 的回答很有用。
而且我还使用了https://github.com/ryanseddon/H5F。在http://microjs.com 上找到。它是某种 polyfill,您可以按如下方式使用它(示例中使用了 jQuery):
if ( $('form')[0].checkValidity() ) {
// the form is valid
}
对于一组输入,您可以使用基于@mikemaccana 的答案的改进版本
$.fn.isValid = function(){
var validate = true;
this.each(function(){
if(this.checkValidity()==false){
validate = false;
}
});
};
现在您可以使用它来验证表单是否有效:
if(!$(".form-control").isValid){
return;
}
您可以使用相同的技术来获取所有错误消息:
$.fn.getVelidationMessage = function(){
var message = "";
var name = "";
this.each(function(){
if(this.checkValidity()==false){
name = ($( "label[for=" + this.id + "] ").html() || this.placeholder || this.name || this.id);
message = message + name +":"+ (this.validationMessage || 'Invalid value.')+"\n<br>";
}
})
return message;
}