您可以使用这个简单的CSS语句禁用事件

#my-div {
    pointer-events:none;
}

正如许多答案已经澄清的那样，disabled不是DIV属性。然而，xHTML意味着可扩展的HTML。这意味着您可以定义自己的HTML属性(所有Frontend框架都可以这样做)。CSS支持[]属性选择器。

使用标准的HTML和你定义的属性:

<div disabled>My disabled div</div>

使用CSS:

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

注意:你也可以使用带有ID或类名的CSS属性选择器，例如. mydiv [disabled]{…}也可以应用值过滤器，例如:下面的HTML禁用标准属性值div[disabled=disabled]{…}。

$("#yourdivid textarea, #yourdivid input, #yourdivid select").attr('disabled',true);

正如评论中提到的，您仍然可以通过使用tab键在元素之间导航来访问元素。所以我推荐这个:

$("#mydiv")
  .css({"pointer-events" : "none" , "opacity" :  "0.4"})
  .attr("tabindex" , "-1");

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

测试浏览器: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);
        }
    }