Question

我在我的网络应用中使用了jquery.validation插件。我有这个表格验证的通用代码：

$('form[data-toggle="validator"]').each(function () {
            $(this).validate({
                errorClass: "help-block error",
                errorElement: "div",
                focusCleanup: false,
                focusInvalid: false,
                submitHandler: function(form){
                    $("[type=submit]",form).prop("disabled",true);
                    form.submit();
                }
            });
         });

当我需要验证时，我只需将data-toggle属性设置为表单。

在特定情况下，我想添加一个自定义规则，不是针对单个输入元素，而是针对所有表单。我想在运行时添加它，它可能吗？

Answer 1

我认为您正在寻找添加自定义验证方法的方法。下面是我添加验证以检查运行时值的最大长度的示例。

jQuery.validator.addMethod("maxLengthName", function(value, element) {
  return value.length>30;
}, 'Please enter a name with length less than 30.');

值： - 验证元素
元素的当前值： - 要验证的元素

<强>更新

以上方法是为单个输入元素添加自定义方法。现在问题仍然是我们如何才能对形式做同样的事情，而不仅仅是1个输入元素。

不，我们无法将自定义规则添加到<form>元素

但是有一种方法可以为多个输入添加单个规则。以下是相同的示例。在此示例中，我们检查添加的Input 1和Input 2是否等于用户输入的Total

<form id="TotalForm" name="TotalForm">
    <label>Input 1</label>
    <input type="text" name="inputone" id="inputone" class="required" />
    <label>Input 2</label>
    <input type="text" name="inputTwo" id="inputTwo" class="required" />
    <label>Total</label>
    <input type="text" name="inputTotal" id="inputTotal" class="required totalMatch" />
</form>


jQuery.validator.addMethod("totalMatch",function(value) {
        total = parseFloat($('#inputone').val()) + parseFloat($('#inputTwo').val());
        return total == parseFloat($('#inputTotal').val());
    }, "Total is not matching with Input 1 and  Input 2!");

    jQuery.validator.classRuleSettings.totalMatch = { totalMatch: true };

现在您可以在document.ready函数上调用validate，如下所示

$("#TotalForm").validate();

JQuery验证插件和自定义规则

1 个答案: