jquery-validate - 如何在 jquery 表单验证中检查一个列表菜单的值是否大于零？

Question

我有更多选择菜单，命名为 menu1、menu2、menu3 等...

它们的值都在 0 到 10 之间。默认情况下，它们都为 0。

如何使用 jquery 验证插件检查至少一个菜单的值大于零？因为每个都有不同的名称（我可以给出相同的类，但我看不出这对验证插件有什么帮助，因为我可以针对表单名称而不是类来验证规则）。

Answer 1

一种解决方案是创建自定义规则。

我已经调整了这个答案并添加了一个名为mulitselect的自定义规则。如果没有一个值 > 0，这会在第一个下拉列表中添加一个错误 。检查 jsfiddle 上的演示。

note1这目前适用于表单中的每个选择列表，更改选择器以将其限制为按类或其他方式的某些选择列表。

note2我在提交无效表单后添加了 onclick 功能，因为在选项中添加它会导致验证有点过于“急切”。

js如下

$(function () {
    $.validator.addMethod("multiselect", function (value, element) {
        var countValid = $('select').filter(function () {
            return $(this).val() > 0;
        }).length;
        if (countValid === 0 && $('select:first')[0] === element) {
            return false;
        }
        else {
            return true;
        }
    }, "please select at least one of the menus");

    $('select').addClass("multiselect");
    $('form').bind("invalid-form", function () {
        $('form').validate().settings.onclick = function () { $("form").valid() };
    }).validate({
        debug: true
    });

});