Question

我已经实现了Jquery Validator，但是面临一些条件验证的问题，这个问题在某个时候无效。

我要求在选择了单选按钮时需要控制，因为我创建了一个被调用的函数，并且我将单选按钮名称传递给它。
我在其他验证中遇到过这个问题，只需要控件如果从3中选择了两个单选按钮中的任何一个。

每次调用警报时我都会向函数添加警报，但验证不会我已经截断了我的验证码让我知道如果我做错了什么

Js代码： -

$('#ConditionalLiability').validate({
    onfocusout: false,
    onkeyup: false,
    rules: {
        ConcernsNoted: {
            required: true
        },
        ConcernsWithExteriorWalls: {
            required: ValidationRadio("ConcernsNoted", 'Y')
        },
        chkExteriorWalls: {
            required: ValidationRadio("ConcernsWithExteriorWalls", 'Y')
        },
        GranularLossComments: {
            required: Conditional("GranularLoss")
        }
    },
    showErrors: function (errorMap, errorList) {
        var messages = "";
        var check = 0;
        $.each(errorList, function (index, value) {
            check = 1;
            var id = $(value.element).attr('id');
            messages += (index + 1) + ". " + value.message + "\n";
        });
        messages = "Please correct following errors \n" + messages;
        if (check == 1) {
            alert(messages);
        }
    },
    submitHandler: function () {
        SaveData();
    },
    messages: {
        ConcernsNoted: {
            required: "Please select a value for Concerns With Home Exterior"
        },
        ConcernsWithExteriorWalls: {
            required: "Please select a value for Concerns With Exterior Walls"
        },         
        chkExteriorWalls: {
            required: "Please select at least one option for Concerns with Exterior Walls"
        },
        GranularLossComments: { required: "Please enter comments for GranularLoss"
        }

    }
});


function Conditional(id) {
    var element = "input:radio[name='" + id + "']:checked";
    var radio_value = $(element).val();
    if ((radio_value == 'M') || (radio_value == 'S')) {
        return true;
    } else {
        return false;
    }
}

function ValidationRadio(id, check) {
    var element = "input:radio[name='" + id + "']:checked";
    var radio_value = $(element).val();
    if (radio_value == check) {
        alert('true');
        return true;
    } else {
        return false;
    }
}

Answer 1

.validate()是插件的初始化方法，但是，as per your jsFiddle，您将其称为测试表单有效性的方法...

$(document).ready(function () {
      $('#submit').click(function () {
        submitForm();
    });
});

function submitForm() { 
    $('#ConditionalLiability').validate({
        // options & rules
    });
}

function Conditional(id) {
    // your code
}

function ValidationRadio(id, check) {
    // your code
}

初始化后，插件会自动捕获提交按钮的点击事件。

摆脱你的click处理程序。您不需要它，并且在许多情况下，它会干扰插件的默认行为。

此外：

由于您使用的是jQuery Mobile，请使用.on('pageinit', function()代替.ready(function()
摆脱破碎的外部条件函数，改用depends子选项（见下文）。

将您的代码重新计入此...

$(document).on('pageinit', function () {

    $('#ConditionalLiability').validate({
        onfocusout: false,
        onkeyup: false,
        rules: {
            ConcernsNoted: {
                required: true
            },
            ConcernsWithExteriorWalls: {
                required: {
                    depends: function (element) {
                        return $("[name='ConcernsNoted'][value='Y']").is(":checked");
                    }
                }
            },
            chkExteriorWalls: {
                required: {
                    depends: function (element) {
                        return $("[name='ConcernsWithExteriorWalls'][value='Y']").is(":checked");
                    }
                }
            },
            GranularLossComments: {
                 required: {
                    depends: function (element) {
                return ( $("[name='GranularLoss'][value='M']").is(":checked") || $("[name='GranularLoss'][value='S']").is(":checked") );
                    }
                 }
            }
        },
        showErrors: function (errorMap, errorList) {
            var messages = "";
            var check = 0;
            $.each(errorList, function (index, value) {
                check = 1;
                var id = $(value.element).attr('id');
                messages += (index + 1) + ". " + value.message + "\n";
            });
            messages = "Please correct following errors \n" + messages;
            if (check == 1) {
                alert(messages);
            }
        },
        submitHandler: function () {
            SaveData();
        },
        messages: {
            ConcernsNoted: {
                required: "Please select a value for Concerns With Home Exterior"
            },
            ConcernsWithExteriorWalls: {
                required: "Please select a value for Concerns With Exterior Walls"
            },
            chkExteriorWalls: {
                required: "Please select at least one option for Concerns with Exterior Walls"
            },
            GranularLossComments: {
                required: "Please enter comments for GranularLoss"
            }
        }
    });

});

DEMO：http://jsfiddle.net/6GHKN/

使用Jquery的条件验证有时不起作用

1 个答案: