Question

我有一组html输入：复选框项。其中一项具有已禁用属性。预期的行为是jquery验证插件将忽略带有禁用属性的输入，但会处理未禁用的其他元素的验证。

<input type="checkbox" name="example[]" value="1" minlength="1" required="required" disabled="disabled" />
<input type="checkbox" name="example[]" value="2" minlength="1" required="required" />
<input type="checkbox" name="example[]" value="3" minlength="1" required="required" />

我已经创建了一个实例来演示行为。 http://jsfiddle.net/cVMBA/24/

预期的行为是在这种情况下至少选中了一个复选框。如果没有，则应出现错误。虽然我可以看到这种行为真的很奇怪。如果您在控制台中查看，您可以看到首先激活 errorPlacement 函数，然后激活 unhighlight 函数。所以这里的问题是没有显示错误。

删除属性 disabled =“disabled”时，插件将按预期工作。任何想法，或者可能是黑客来覆盖这种行为？

Answer 1

该插件在disabled="disabled"属性方面运行正常，如下所示：http://jsfiddle.net/4fShN/

关于您的代码：

$('#test_validate').validate({
    ignore : [],
    unhighlight : function(element, errorClass, validClass){
         $('#test_validate').removeClass('error-highlighted');
    },
    errorPlacement: function(error, element) {           
        $('#test_validate').addClass('error-highlighted').find('.error-div').text('Select radio button');
    },
    submitHandler: function(form) {
            alert('form ok');
    }
});

您缺少highlight回调函数，它是unhighlight回调的补充。您应该注意errorPlacement仅在最初放置错误label元素时触发。如果您想要与错误一起切换，则应该使用highlight和unhighlight函数。

此外，您的代码正在将该类应用于$('#test_validate')，其中包含id元素的<form>。通常，您申请＆amp;使用包含的<input>参数从element元素中删除包含错误的类。

    highlight : function(element, errorClass, validClass){
        $(element).addClass('error-highlighted');
    },
    unhighlight : function(element, errorClass, validClass){
        $(element).removeClass('error-highlighted');
    },

为了简化操作，只需定义validClass和errorClass选项即可删除上述代码。他们为什么要被删除？因为上面的两个函数与默认的插件行为基本相同。

errorClass: "error-highlighted",
validClass: "valid"

参见文档：http://jqueryvalidation.org/validate

Jquery验证插件禁用属性错误

1 个答案: