Question

我正在使用jQuery Validation Plugin 1.9.0来验证我的样式表单。我测试过IE7 / 8/9，Firefox，Safari，Chrome和Opera。除了验证Safari和Chrome中的复选框外，一切正常。发布表单没有错误消息或阻止。有什么我可以做的，或者这是Safari和Chrome的问题吗？

复选框：

<label class="checkbox" for="joingroupkey_1">
    <input type="checkbox" class="checkbox hiddeninput" value="1" id="joingroupkey_1" name="joingroupkey">
    <div class="checkbox styled"></div>
    Newsletter 1
</label>
<label class="checkbox" for="joingroupkey_2">
    <input type="checkbox" class="checkbox hiddeninput" value="2" id="joingroupkey_2" name="joingroupkey">
    <div class="checkbox styled"></div>
    Newsletter 2
</label>
<label class="checkbox" for="joingroupkey_3">
    <input type="checkbox" class="checkbox hiddeninput" value="3" id="joingroupkey_3" name="joingroupkey">
    <div class="checkbox styled"></div>
    Newsletter 3
</label>

脚本：

$('#newsletter').validate({
    rules: {
        joingroupkey: {
            required: true,
            minlength: 1
        }
    },
    errorPlacement: function(label, element) {
        label.insertBefore(element);
    }
});

Answer 1

最后我在一个简单的css中找到了我的问题的答案：

输入，textarea，选择{-webkit-appearance：none; -moz-appearance：none;}

当我删除此行时，验证工作正常。

我不得不承认我不知道这是如何影响脚本的，我不得不从生成的html开始，然后按照我的方式开始直到我发现css导致问题。

Answer 2

再有一个CSS可以停止对chrome和safari中的复选框进行验证。（仍在2018年!!!）

width:0px;height:0px;

JQuery验证和复选框（Chrome / Safari）

2 个答案: