如何禁用所有 div 内容

Question

我假设如果我禁用了一个 div，所有内容也会被禁用。

但是，内容是灰色的，但我仍然可以与之交互。

有没有办法做到这一点？ （禁用 div 并禁用所有内容）

原文由 juan 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

上述许多答案仅适用于表单元素。禁用任何 DIV 包括其内容的简单方法是禁用鼠标交互。例如：

 $("#mydiv").addClass("disabledbutton");

CSS

 .disabledbutton {
 pointer-events: none;
 opacity: 0.4;
 }

补充：

许多人这样评论：“这只会禁止鼠标事件，但控件仍处于启用状态”和“您仍然可以通过键盘导航”。您可以将此代码添加到您的脚本中，并且无法通过键盘选项卡等其他方式访问输入。您可以更改此代码以满足您的需要。

 $([Parent Container]).find('input').each(function () {
 $(this).attr('disabled', 'disabled');
 });

原文由 Kokodoko 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

使用 JQuery 之类的框架来执行以下操作：

 function toggleStatus() {
    if ($('#toggleElement').is(':checked')) {
        $('#idOfTheDIV :input').attr('disabled', true);
    } else {
        $('#idOfTheDIV :input').removeAttr('disabled');
    }
}

使用 jQuery 在 Div 块中禁用和启用输入元素 应该对您有所帮助！

从 jQuery 1.6 开始，您应该使用 .prop 而不是 .attr 来禁用。

原文由 Martin K. 发布，翻译遵循 CC BY-SA 3.0 许可协议