Question

我正在使用JQuery Validate库，我有一个按钮，当点击它时，会打开一个按钮旁边弹出的复选框列表。我想要做的是，如果单击“提交”时未选中任何复选框，则将验证错误放在按钮上，以便将.error类应用于按钮，这样我就可以将样式设置为按钮而不是复选框（多个）。这基本上就是我所拥有的

<button type="button" id="myButton" name="myButton"></button>
<ul id="myListOfCheckboxes">
    <li><input type="checkbox" id="chk1" name="checkboxList"></li>
    <li><input type="checkbox" id="chk2" name="checkboxList"></li>
    <li><input type="checkbox" id="chk3" name="checkboxList"></li>
</ul>

和验证......

$("#frmMyForm").validate({
    rules: {
        myButton: { 
            required: {
                function(element) {
                    return $("input[name='checkboxList']").is(":checked");
                }
            }
        }
    }
});

Answer 1

将验证错误放在按钮上，以便将.error类应用于按钮，这样我就可以将样式设置为按钮而不是复选框。

你不能直接这样做。

您绝对无法使用此插件验证button元素。 jQuery Validate仅用于验证包含实际表单数据的元素：select，textarea，某些类型的input元素以及具有contenteditable属性的某些元素。没别了。

解决方法可能是您验证type="hidden" input元素而不是button。将隐藏元素放在按钮附近，以便验证消息显示在您需要的位置附近。请务必更改ignore中的.validate()选项以允许此操作。

由于当复选框留空时会触发错误，因此您实际上只是在复选框上验证required规则！由于是这种情况，您可以根据复选框上的错误类以编程方式将错误类应用于button。

Answer 2

使用this，beacuse输入标记，其name属性为checkboxList而不是id

$("#frmMyForm").validate({
        rules: {
            myButton: { 
                  required: {
                       function(element) {
                           return $("input[name='checkboxList']").is(":checked");
                       }
              }
           }
        }
    });

根据复选框验证按钮

2 个答案: