jQuery跨多个字段进行验证

Question

我有3个输入字段,询问人数,其中有多少是成人,有多少是孩子.我正在尝试使用jQuery validate插件来添加一个自定义方法,其中儿童+成人=人数

这是我的验证电话

$("#form2").validate({
    errorElement: "span",
        rules: {
        attendees: {
             required: true,
             digits: true
        },              
        adults: {
             required: true,
             digits: true
        },              
        children: {
             required: true,
             digits: true
        }
    },
    messages: {
        attendees: "Enter the number of persons (including yourself)", 
        adults: "Enter number of adults", 
        children: "Enter number of childern"                
    }               
});

我查看了feature插件的group功能和addMetod,但它似乎只考虑了一个元素.有任何想法吗 ？

Answer 1

按照文档创建自定义方法/规则.在这里,我只是称之为totalCheck,但你可以任意命名.

$.validator.addMethod('totalCheck', function(value, element, params) {
    var field_1 = $('input[name="' + params[0] + '"]').val(),
        field_2 = $('input[name="' + params[1] + '"]').val();
    return parseInt(value) === parseInt(field_1) + parseInt(field_2);
}, "Enter the number of persons (including yourself)");

它的实现与任何其他规则一样.这两个参数是name您要检查的其他两个字段的属性.由于这个新的规则说的字段必须包含两个字段的总和,在required和digits规则是现在多余的,可以删除.

$("#form2").validate({
    errorElement: "span",
    rules: {
        attendees: {
            totalCheck: ['adults', 'children'] // <-- your custom rule
        },
        adults: {
            required: true,
            digits: true
        },
        children: {
            required: true,
            digits: true
        }
    },
    messages: {
        adults: "Enter number of adults",
        children: "Enter number of childern"
    }
});

工作演示:http: //jsfiddle.net/hBXL6/