Question

我在不同的页面中有多个表单，有没有办法编写一个single function来处理validation，或者我应该为每个表单separately编写代码。

$(document).ready(function () {   
    $('#fvujq-form1').validate();
    $('#fvujq-form2').validate();
});

注意：每个表单都有自己的规则。

更新

$("form").each(function () {
        $(this).validate({

            rules: {

                username: {
                    required: true
                },
                password: {
                    required: true
                },
                name: {
                    required: true,                        
                },
                cperson: {
                    required: true,                       
                }
            },
            submitHandler: function (form) {
                return false; //temporarily prevent full submit
            }
        });
    });

现在，不同表单的username和password以及{{1>}和name在不同页面中的格式不同。以这种方式提交共同表格是否正确。

Answer 1

您可以使用$（＆＃34; form＆＃34;）选择器验证所有类型的元素，如果这是您要求的。我不建议专门针对具有多种形式的页面。

Answer 2

您应该使用$('form').validate();进行测试，如果不起作用，请使用：

$('form').each(function(){
    $(this).validate();
});

Answer 3

如果您可以为表单中的每个输入元素指定一个自定义xx-field-type属性，例如：

<input type='text' xx-field-type='email'/>

您可以使用：

jQuery.fn.extend({
    validate: function() {
        var input_list = this.find("input");
        for (var i = 0; i < input_list.length; i++) {
            switch(input_list[i].attr("xx-field-type")) {
                case 'username':
                    var value = input_list[i].val();
                    if (value.match(/^[a-z0-9]+$/) != true) {
                        return false;
                    }
                    break;
                case 'password':
                    var value = input_list[i].val();
                    if (value.match(/[a-z]+/) != true 
                        || value.match(/[A-Z]+/) != true
                        || value.match(/[0-9]+/) != true) {
                        return false;
                    }
                    break;
                case 'email':
                    var value = input_list[i].val();
                    if (value.match(/^[a-z0-9]+@[a-z0-9]$/) != true) {
                        return false;
                    }
                    break;
                default:
                    continue;
            }
        }
        return true;
    }
});

这将遍历表单的每个输入字段，检查它的xx-field-type属性的值，并使用它来选择值必须匹配的规则。如果有任何失败，则返回false，否则返回true。

如果您无法添加自定义属性，则可以使用类，但使用用于设置显示相关内容的属性来表示表单类型会感觉很麻烦。

<强>未测试

我使用的字段类型和regexp仅用于演示目的。

jQuery多表单验证

3 个答案: