即使元素被禁用，jQuery 验证插件也会失败元素验证

Question

HTML 代码片段示例如下:

<select name="paytitle" id="paytitle">
    <option value="Budget Keeper" selected>Budget Keeper</option>
    <option value="Bookkeeper">Bookkeeper</option>
    <option value="Treasurer">Treasurer</option>
    <option value="Accounts Payable">Accounts Payable</option>
    <option value="Other">Other</option>
</select>
<div id="otherfield">Other: <input name="paytitleother" type="text" id="paytitleother" class="required" /></div>

我有一个函数可以根据选择的值禁用和隐藏 paytitleother 字段:

$('#paytitle').change(function() {
    if ($(this).val() == 'Other')
    {
        $("#paytitleother").removeAttr("disabled");
        $("#otherfield").css("display", "block");
    } else {
        $("#paytitleother").attr("disabled", true);
        $("#otherfield").css("display", "none");
    }
});

当我尝试提交表单时，paytitleother 字段仍然无法验证，即使它已被禁用和隐藏。验证插件的文档指出所有禁用的字段都会自动忽略，但我采取了额外的步骤将 ignore: ":disabled" 添加到验证例程中:

$('#fieldForm').validate({
    ignore: ':disabled',
    ...
});

即使使用此规范，字段验证也会失败。我已经在这个项目上工作了一整天，所以我可能忽略了一些简单的事情，但我看不到它，也无法理解我的生活发生了什么。

Answer 1

设置 disabled 属性时，尝试使用值“disabled”而不是 true，如下所示:

$("#paytitleother").attr("disabled", "disabled");

jQuery documentation .attr() 有一些与如何在 HTML 4 和 XHTML 中设置“disabled”属性相关的注释，甚至还有一些关于 HTML5 的思考。