如何在Jquery验证规则中实现“或”条件

时间:2013-12-28 12:04:34

标签: jquery jquery-validate

我目前正在使用jquery验证插件来验证我的表单,在这里我要验证固定电话号码手机号码。用户想要输入任何一个。所以我想要在jquery验证规则中使用条件。

rules{ 'landline':{ required:true }, 'mobile':{ required:true } }

如何强制要求任何一个字段。

3 个答案:

答案 0 :(得分:7)

如果您希望错误消息正确切换并使代码看起来简洁,只需使用专门为此情况创建的方法。规则/方法称为require_from_group,并包含在the additional-methods.js file中。

$(document).ready(function () {

    $("#form").validate({
        rules: {
            landline: {
                require_from_group: [1, '.phone'],
                number: true
            },
            mobile: {
                require_from_group: [1, '.phone'],
                number: true
            }
        }
    });

});

DEMO:http://jsfiddle.net/t45dc/

要将两个错误消息组合成一个,请使用groups选项...

$(document).ready(function () {

    $("#form").validate({
        rules: {
            landline: {
                require_from_group: [1, '.phone'],
                number: true
            },
            mobile: {
                require_from_group: [1, '.phone'],
                number: true
            }
        },
        groups: {
            phones: 'landline mobile'
        }
    });

});

DEMO:http://jsfiddle.net/t45dc/1/

答案 1 :(得分:3)

试试这个

landline: {
    required: function(element) {
        if ($("#m_no").val().length > 0) {
            return false;
        } else {
            return true;
        }
    },
    number: true
},
mobile: {
    required: function(element) {
        if ($("#land_no").val().length > 0) {
            return false;
        } else {
            return true;
        }
    },
    number: true
}

答案 2 :(得分:0)

您不需要加入additional-methods.js

您需要从validaor.js和additional-methods.js中提取所需的部分并定义如下

向验证器原型添加一个方法elementValue

$.validator.prototype.elementValue = function( element ) {
            var $element = $( element ),
                type = element.type,
                val, idx;

            if ( type === "radio" || type === "checkbox" ) {
                return this.findByName( element.name ).filter( ":checked" ).val();
            } else if ( type === "number" && typeof element.validity !== "undefined" ) {
                return element.validity.badInput ? "NaN" : $element.val();
            }

            if ( element.hasAttribute( "contenteditable" ) ) {
                val = $element.text();
            } else {
                val = $element.val();
            }

            if ( type === "file" ) {

                // Modern browser (chrome & safari)
                if ( val.substr( 0, 12 ) === "C:\\fakepath\\" ) {
                    return val.substr( 12 );
                }

                // Legacy browsers
                // Unix-based path
                idx = val.lastIndexOf( "/" );
                if ( idx >= 0 ) {
                    return val.substr( idx + 1 );
                }

                // Windows-based path
                idx = val.lastIndexOf( "\\" );
                if ( idx >= 0 ) {
                    return val.substr( idx + 1 );
                }

                // Just the file name
                return val;
            }

            if ( typeof val === "string" ) {
                return val.replace( /\r/g, "" );
            }
            return val;
        }

并定义新规则:

$.validator.addMethod("require_from_group", function(value, element, options) {
        var $fields = $(options[1], element.form),
            $fieldsFirst = $fields.eq(0),
            validator = $fieldsFirst.data("valid_req_grp") ? $fieldsFirst.data("valid_req_grp") : $.extend({}, this),
            isValid = $fields.filter(function() {
                return validator.elementValue(this);
            }).length >= options[0];

        // Store the cloned validator for future validation
        $fieldsFirst.data("valid_req_grp", validator);

        // If element isn't being validated, run each require_from_group field's validation rules
        if (!$(element).data("being_validated")) {
            $fields.data("being_validated", true);
            $fields.each(function() {
                validator.element(this);
            });
            $fields.data("being_validated", false);
        }
        return isValid;
    }, $.validator.format("Please select at least {0} Energy or Water fields."));

新的字段规则synatx:

energyCategory: {
                  require_from_group: [1,'.select-drop-down']
                },
waterCategory: {
                require_from_group: [1,'.select-drop-down']
               } 

这适用于旧的jquery验证插件版本1.9,也无需升级到新版本。