我有一个带有几个按钮的表单,我正在使用来自http://jquery.bassistance.de/validate/的jQuery Validation Plugin。我只想知道是否有任何方法可以检查表单是否被我的javascript代码中的任何位置的jquery验证插件视为有效状态。
答案 0 :(得分:110)
使用.valid()
:
$("#form_id").valid();
检查所选表单是否有效或是否全部选中 元素是有效的。之前需要在表单上调用validate() 使用这种方法检查它。
id='form_id'
表单中的表单是已经调用.validate()
的表单。
答案 1 :(得分:31)
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
答案 2 :(得分:6)
@mikemaccana答案很有用。
我还使用了https://github.com/ryanseddon/H5F。找到http://microjs.com。它是某种polyfill,你可以按如下方式使用它(例子中使用jQuery):
if ( $('form')[0].checkValidity() ) {
// the form is valid
}
答案 3 :(得分:5)
答案 4 :(得分:4)
iContribute:对于正确答案来说永远不会太迟。
var form = $("form#myForm");
if($('form#myForm > :input[required]:visible').val() != ""){
form.submit();
}else{
console.log("Required field missing.");
}
这样,“必填”字段的基本HTML5验证就会发生,而不会使用表单的“名称”值干扰标准提交。
答案 5 :(得分:2)
对于一组输入,您可以使用基于@ 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;
}
答案 6 :(得分:0)
对于Magento,您可以通过以下方式检查表单验证。
你可以试试这个:
require(["jquery"], function ($) {
$(document).ready(function () {
$('#my-button-name').click(function () { // The button type should be "button" and not submit
if ($('#form-name').valid()) {
alert("Validation pass");
return false;
}else{
alert("Validation failed");
return false;
}
});
});
});
希望这可以帮到你!