如何检查所有字段是否有效?
How to check all fields are valid?
此代码检查每个元素是否有效,并根据其情况附加 css class。
如果该元素有效,它会从提交按钮(blocksender)中删除禁用的标签。
但是,
当某些元素有效而某些元素无效时
如果您从有效元素中聚焦,则启用提交按钮。有问题。
如何查看所有元素?如果它们都有效,我可以启用提交按钮。
$(document).on('focusout', 'input.validate, textarea.validate', function() {
if ($(this).hasClass('is_required') || $(this).val().length)
{
var result = window['validate_'+$(this).attr('data-validate')]($(this).val())
if (result)
{
$(this).parent().removeClass('form-error').addClass('form-ok');
$(".blocksender").removeAttr("disabled", "disabled");
}
else
{
$(this).parent().addClass('form-error').removeClass('form-ok');
$(".blocksender").attr("disabled", "disabled");
}
}
});
这是来自 Prestashop 1.6 中的 validate.js,我在 contact_form.tpl 中使用它,类似的东西:
<input class="validate is_required" type="text" id="email" name="from" data-validate="isEmail"/>
我会计算出现错误的元素的数量class:如果为 0,则启用按钮,如果不是,则禁用它
$(document).on('focusout', 'input.validate, textarea.validate', function() {
if ($(this).hasClass('is_required') || $(this).val().length)
{
var result = window['validate_'+$(this).attr('data-validate')]($(this).val())
if (result)
{
$(this).parent().removeClass('form-error').addClass('form-ok');
// There's the chance of no errors, check it.
var numItems = $('.form-error').length;// Check number of elements with class error.
if(numItems === 0) {// If all items are ok, remove disable.
$(".blocksender").removeAttr("disabled", "disabled");
}
}
else// There's at least one error, no need to check, disable it.
{
$(this).parent().addClass('form-error').removeClass('form-ok');
$(".blocksender").attr("disabled", "disabled");
}
}
});
此代码检查每个元素是否有效,并根据其情况附加 css class。 如果该元素有效,它会从提交按钮(blocksender)中删除禁用的标签。
但是, 当某些元素有效而某些元素无效时 如果您从有效元素中聚焦,则启用提交按钮。有问题。
如何查看所有元素?如果它们都有效,我可以启用提交按钮。
$(document).on('focusout', 'input.validate, textarea.validate', function() {
if ($(this).hasClass('is_required') || $(this).val().length)
{
var result = window['validate_'+$(this).attr('data-validate')]($(this).val())
if (result)
{
$(this).parent().removeClass('form-error').addClass('form-ok');
$(".blocksender").removeAttr("disabled", "disabled");
}
else
{
$(this).parent().addClass('form-error').removeClass('form-ok');
$(".blocksender").attr("disabled", "disabled");
}
}
});
这是来自 Prestashop 1.6 中的 validate.js,我在 contact_form.tpl 中使用它,类似的东西:
<input class="validate is_required" type="text" id="email" name="from" data-validate="isEmail"/>
我会计算出现错误的元素的数量class:如果为 0,则启用按钮,如果不是,则禁用它
$(document).on('focusout', 'input.validate, textarea.validate', function() {
if ($(this).hasClass('is_required') || $(this).val().length)
{
var result = window['validate_'+$(this).attr('data-validate')]($(this).val())
if (result)
{
$(this).parent().removeClass('form-error').addClass('form-ok');
// There's the chance of no errors, check it.
var numItems = $('.form-error').length;// Check number of elements with class error.
if(numItems === 0) {// If all items are ok, remove disable.
$(".blocksender").removeAttr("disabled", "disabled");
}
}
else// There's at least one error, no need to check, disable it.
{
$(this).parent().addClass('form-error').removeClass('form-ok');
$(".blocksender").attr("disabled", "disabled");
}
}
});