这是给搜索者的，

我做得最好的是，

$('#myDiv *').attr("disabled", true);                   
$('#myDiv *').fadeTo('slow', .6);

或者只使用css和一个“disabled”类。 注意:不要使用disabled属性。 不需要摆弄jQuery的开/关。 这是非常简单的，跨浏览器工作:

.disabled{
    position: relative;
}
.disabled:after{
    content: "";
    position: absolute;
    width: 100%;
    height: inherit;
    background-color: rgba(0,0,0,0.1);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

然后，在初始化页面或切换按钮时，可以打开或关闭它

if(myDiv !== "can be edited"){
    $('div').removeClass('disabled');
} else{
    $('div').addClass('disabled');
}

有一些可配置的javascript库可以接收html字符串或dom元素，并去掉不需要的标签和属性。这些被称为html杀菌剂。例如:

DOMPurify 疯狂的 sanitize-html

例如，在DOMPurify中

DOMPurify.sanitize('<div>abc<iframe//src=jAva&Tab;script:alert(3)>def</div>'); 
// becomes <div>abcdef</div>

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

function disableItems(divSelector){
    var disableInputs = $(divSelector).find(":input").not("[disabled]");
    disableInputs.attr("data-reenable", true);
    disableInputs.attr("disabled", true);
}

function reEnableItems(divSelector){
    var reenableInputs = $(divSelector).find("[data-reenable]");
    reenableInputs.removeAttr("disabled");
    reenableInputs.removeAttr("data-reenable");
}

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

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

您可以添加以下CSS

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

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