测试浏览器:IE 9、Chrome、Firefox和jquery-1.7.1.min.js

    $(document).ready(function () {
        $('#chkDisableEnableElements').change(function () {
            if ($('#chkDisableEnableElements').is(':checked')) {
                enableElements($('#divDifferentElements').children());
            }
            else {
                disableElements($('#divDifferentElements').children());
            }
        });
    });

    function disableElements(el) {
        for (var i = 0; i < el.length; i++) {
            el[i].disabled = true;

            disableElements(el[i].children);
        }
    }

    function enableElements(el) {
        for (var i = 0; i < el.length; i++) {
            el[i].disabled = false;

            enableElements(el[i].children);
        }
    }

如果您想保持禁用的语义，如下所示

<div disabled="disabled"> Your content here </div>

您可以添加以下CSS

div[disabled=disabled] {
  pointer-events: none;
  opacity: 0.4;
}

这样做的好处是，您不需要使用您想要使用的div上的类

在jQuery中，另一种方法是获得包含DIV的内部高度、内部宽度和位置，然后简单地覆盖另一个DIV，透明的，在相同大小的上面。这将适用于容器内的所有元素，而不仅仅是输入。

记住，尽管禁用了JS，你仍然可以使用DIVs的输入/内容。上面的答案也一样。

类似于cletu的解决方案，但我得到了一个错误使用的解决方案，这是解决方案:

$('div *').prop('disabled',true);
// or
$('#the_div_id *').prop('disabled',true);

对我来说还行

如果你只是想阻止人们点击，并且不太担心安全问题——我已经找到了一个z-index为99999的绝对div。您不能单击或访问任何内容，因为div被放置在它上面。可能更简单一点，是CSS唯一的解决方案，直到你需要删除它。

这个css仅/noscript解决方案在fieldset(或div或任何其他元素)上添加了一个覆盖层，防止交互:

fieldset { position: relative; }
fieldset[disabled]::after { content: ''; display: inline-block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: all; background: rgba(128,128,128,0.2); }

如果你想要一个不可见的，即透明的覆盖，将背景设置为rgba(128,128,128,0)，因为没有背景它将不起作用。 以上操作适用于IE9+。下面这个简单得多的css可以在IE11+上运行

[disabled] { pointer-events: none; }

铬