Javascript 在jQuery验证插件中使用depends

我有一个表单，其中有一堆默认禁用的文本框，然后使用每个文本框旁边的复选框启用

启用时，这些文本框中的值必须是有效数字，但禁用时，它们不需要值（显然）。我正在使用jQuery验证插件进行验证，但它似乎没有达到我的预期

当我单击复选框并禁用文本框时，尽管我在规则中添加了

dependens

子句，但仍然会出现无效字段错误（请参见下面的代码）。奇怪的是，实际发生的是，错误消息显示了一瞬间，然后消失了

以下是复选框和文本框列表的示例：

<ul id="ItemList">
<li>
    <label for="OneSelected">One</label><input id="OneSelected" name="OneSelected" type="checkbox" value="true" />
    <input name="OneSelected" type="hidden" value="false" />
    <input disabled="disabled" id="OneValue" name="OneValue" type="text" />
</li>
<li>
    <label for="TwoSelected">Two</label><input id="TwoSelected" name="TwoSelected" type="checkbox" value="true" />
    <input name="TwoSelected" type="hidden" value="false" />
    <input disabled="disabled" id="TwoValue" name="TwoValue" type="text" />
</li>
</ul>

---

忽略每个

li

中的隐藏字段，因为我正在使用asp.net MVC的

Html.Checkbox

方法。

我不知道这是否是您想要的。。。但是，在选中该框时，是否会将.required更改为.wasReq（作为占位符以区分此选项和可能不需要的选项）执行相同的操作？如果未选中该字段，则不需要该字段——您还可以删除类（number）以消除其中的错误

据我所知，即使某个字段被禁用，应用于该字段的规则仍然适用。或者，你也可以试试这个

// Removes all values from disabled fields upon submit
$(form).submit(function() {
   $(input[type=text][disabled=disabled]).val();
});

---

我还没有尝试过validator插件，但事实上，消息显示了一秒钟，这听起来像是双重绑定，你怎么称呼你的绑定器？如果在函数中绑定，请在开始之前尝试解除绑定，如下所示：

$('#ItemList :checkbox').unbind("click");
...Rest of code here...

---

禁用/启用后不应验证字段

jQuery('#ItemList :checkbox').click(function(event) {
        var textBox = jQuery(this).siblings(':text');

        if (!jQuery(this).attr("checked")) {
                textBox.attr('disabled', 'disabled');
                textBox.val('');
        } else {
                textBox.removeAttr('disabled');
                textBox[0].focus();
        }
        textBox.valid();    
});

使用“ignore”选项（）可能是处理此问题的最简单方法。取决于你在表格上还有什么。例如，如果您有其他已禁用的控件，但由于某些原因仍需要验证，则不会对禁用的项进行筛选。然而，如果这条路线不起作用，使用一个额外的类进行过滤（使用复选框添加和删除）应该可以让您到达您想要去的地方，但更容易

即

---

通常在执行此操作时，我跳过“depends”，只使用

required

jQuery验证规则，让它根据给定的选择器处理检查，而不是在验证规则和复选框单击处理程序之间拆分逻辑。我用你的标记把我是如何完成这项工作的

实际上，它归结为

必需：“#OneSelected:checked”

。这使得只有表达式为true时才需要相关字段。在演示中，如果您立即提交页面，它将正常工作，但当您选中复选框时，表单将无法提交，直到选中的字段中填充了一些输入。如果希望在单击时验证整个表单，您仍然可以在复选框单击处理程序中放置一个

.valid（）

调用

---

（另外，我利用jQuery的奇妙链接功能，将您的复选框切换缩短了一点，尽管您对

textBox

的“缓存”同样有效。）

依赖参数工作不正常，我想文档已经过时了。 我设法做到了这样：

required : function(){ return $("#register").hasClass("open")}

---

我也有同样的问题

我通过在整个表单上调用valid（）单选按钮更改事件处理程序解决了这个问题

---

工作得很好。上述其他解决方案对我不起作用

以下是@Collin Allen的回答：

问题是，如果在错误消息可见时取消选中复选框，错误消息不会消失

我已通过删除禁用字段时的错误消息解决了此问题

以Collin的演示为例，对启用/禁用过程进行以下更改：

jQuery('#ItemList :checkbox').click(function()
{
    var jqTxb = $(this).siblings(':text')
    if ($(this).attr('checked'))
    {       
        jqTxb.removeAttr('disabled').focus();
    }
    else
    {
        jqTxb.attr('disabled', 'disabled').val('');
        var obj = getErrorMsgObj(jqTxb, "");
        jqTxb.closest("form").validate().showErrors(obj);
    }
});
function getErrorMsgObj(jqField, msg)
{
    var obj = {};
    var nameOfField = jqField.attr("name");
    obj[nameOfField] = msg;
    return obj;
}

您可以看到，在禁用错误消息时，I guts会将其从字段中删除

如果您担心

$（“form”）.validate（）

，请不要！

---

它不会重新验证表单，只返回jQuery验证的API对象。

我只是在评论，而不是回答，因为我从未使用过验证插件。您是否尝试过将textBox.validate（）放在if语句中检查复选框的true部分中？不幸的是，没有这样做it@drudru：您需要验证选择器是否正确。当然，“：disabled”指定应忽略所有禁用的选择器。或者，忽略：“.ignoreMe”将忽略类为“ignoreMe”的所有元素。+1对于优雅的解决方案，它有一个问题：如果在尝试提交后取消选中复选框，则错误消息不会消失。通过删除禁用字段时的错误消息解决了此问题，将在单独的答案中写入，因为注释中的格式是垃圾

required : function(){ return $("#register").hasClass("open")}

jQuery('#ItemList :checkbox').click(function()
{
    var jqTxb = $(this).siblings(':text')
    if ($(this).attr('checked'))
    {       
        jqTxb.removeAttr('disabled').focus();
    }
    else
    {
        jqTxb.attr('disabled', 'disabled').val('');
        var obj = getErrorMsgObj(jqTxb, "");
        jqTxb.closest("form").validate().showErrors(obj);
    }
});
function getErrorMsgObj(jqField, msg)
{
    var obj = {};
    var nameOfField = jqField.attr("name");
    obj[nameOfField] = msg;
    return obj;
}