如何禁用所有div内容

我的假设是，如果我禁用了一个div，所有的内容也都禁用了。

然而，内容是灰色的，但我仍然可以与它互动。

有办法做到吗?(禁用一个div，让所有的内容也禁用)

当前回答

这是给搜索者的，

我做得最好的是，

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

其他回答

正如许多答案已经澄清的那样，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]{…}。

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

有一些可配置的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>

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

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

在form和fieldset标签中包装div:

<form>
  <fieldset disabled>
    <div>your controls</div>
  </fieldset>
</form>

推荐文章