Question

我遇到了一个问题。我希望能够使用JQUERY在我的网站上实时验证多种形式的数据。例如，我有一个“添加客户”表单，我希望能够禁用“提交”按钮，直到所有字段都经过验证。验证必须实时发生，这意味着每次鼠标移动，按键关键，页面加载和所有其他东西。另一个例子是当我点击我的一个当前客户的“编辑客户”时。弹出一个模式，其中包含已输入所有当前信息的表单。 “提交”按钮必须处于活动状态，因为所有字段都已经过验证。例如，如果我删除名字，则必须禁用“提交”按钮。验证发生在很多方面，我使用formance来验证电话号码和电子邮件。

无论哪种方式，我已经有了一些工作，但它有问题。我想知道这样做的最佳方法是什么？我做得对吗？这是一个例子：

$(document).on('click focus focusin focusout hover keydown keypress keyup load', function() {
if ($("#customer-add-form input[name='phoneNumber']").formance('validate_phone_number') &&
    $("#customer-add-form input[name='email']").formance('validate_email') &&
    $("#customer-add-form input[name='zipCode']").formance('validate_number') &&
    $("#customer-add-form input[name='city']").val().length >= 2 && 
    $("#customer-add-form input[name='firstName']").val().length >= 2 && 
    $("#customer-add-form input[name='lastName']").val().length >= 2 && 
    $("#customer-add-form input[name='companyName']").val().length >= 2 && 
    $("#customer-add-form input[name='address']").val().length >= 2){
        $("#customer-add-form input[type='submit']").prop("disabled", false);
} else {
    $("#customer-add-form input[type='submit']").prop("disabled", true);
} 
}

Answer 1

我建议你不要试图重新发明轮子＆＃34;。

这是一个很好的jQuery表单验证插件：http://formvalidator.net/#reg-form

如果你必须自己滚动，那么你会想要使用类似的东西：

$('input').on('change', function(){...});

如何使用JQUERY实时验证

1 个答案: