Css如何在div中制作非活动内容？

Question

你能帮忙解决一些例子,如何使用javascript使某些div块中的内容无效？

假设有一个带有"启用/禁用"命令的按钮.并且有一个带有一些文本的div块.当按下"启用/禁用"按钮时,如果是"启用",则可以使用内部的内容,但是当"禁用"时,您无法使用div块内的内容.

我想,为了在div块中创建非活动内容,我们需要在其上放置另一层,以防止编辑内容div块上的内容.

我很困惑如何实现这种功能.任何帮助将不胜感激.

Answer 1

如果不使用覆盖,你可以使用pointer-events: none在divCSS中,但是这并不在IE或Opera的工作.

div.disabled
{
  pointer-events: none;

  /* for "disabled" effect */
  opacity: 0.5;
  background: #CCC;
}

参考

Answer 2

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

上面的代码使div的内容禁用。您可以通过添加禁用属性来使div禁用。

<div disabled>
  /* Contents */
</div>