javascript - HTML 输入 "disabled"属性在 Bootstrap 模式中不起作用

Question

我有一个带有“编辑”表单的网页，该表单出现在使用 Bootstrap 的模态对话框中。

当表单出现时，我希望首先禁用其中一个输入字段，然后在用户单击复选框时启用。

问题是，我的浏览器 (Chrome) 没有反射(reflect)模式对话框中任何表单元素的 disabled 属性。模式之外的任何表单元素都可以正常工作。

这在我拥有的具有完全相同逻辑的另一个网页上也能正常工作。它只是在这个页面上表现不佳。

我已经通过 W3 Validator for HTML5 运行了整个页面源代码并且没有返回任何错误。

输入元素的代码:

<form role="form" id="frmEdit" action="group_edit.php" method="post">
    <!-- ... -->
    <input type="text" id="txtEditAlternate" class="form-control" name="alternate" disabled />
    <!-- ... -->
</form>

我什至尝试在文档准备就绪时使用 jQuery 强制禁用它；这不起作用:

$(document).ready(function() {
    $("#txtEditAlternate").attr("disabled", true);
    // ...
});

在禁用文本字段时做的唯一事情是选中复选框然后取消选中:

$("#chkbox").click(function() {
    $("#txtEditAlternate").attr("disabled", !$(this).prop("checked"));
});

尽管这样有违目的，因为文本字段应该在复选框被选中之前被禁用。

我读到，简单地包含没有值的 disabled 是有效的 HTML5(验证器甚至没有警告这一点)，它在其他地方也有效。

我已经尝试了所有我能想到的方法，只能推测它与 Bootstrap 模态功能有关。但正如我所说，同样的逻辑在我的另一个网页上完美运行。

是的，我知道 Chrome 喜欢缓存东西。我已经“硬刷新”了很多次，没有改变任何东西。

有什么建议吗？

Answer 1

尝试使用 disabled="disabled":

<input type="text" id="txtEditAlternate" class="form-control" name="alternate" disabled="disabled" />