Html 如何在 div 中制作非活动内容？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14365751/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make inactive content inside a div?
提问by ilnur777
How to make content in some divblock inactive using JavaScript?
如何div使用 JavaScript使某些块中的内容处于非活动状态？
Let's say there is a button with command "Enable / Disable". And there is one div block with some text. When pushing button "Enable / Disable", is it is "Enable", you can work with content inside, but when "Disable", you can't work with content inside div block.
假设有一个带有“启用/禁用”命令的按钮。并且有一个带有一些文本的 div 块。当按下“启用/禁用”按钮时，它是“启用”，您可以处理里面的内容，但是当“禁用”时，您不能处理 div 块内的内容。
I imagine in order to make inactive content inside div block, we need to put another layer upon that will prevent from editing content on the content div block.
我想为了在 div 块中制作非活动内容，我们需要在上面放置另一层以防止编辑内容 div 块上的内容。
I'm getting confused how to realize this kind of feature.
我对如何实现这种功能感到困惑。
回答by Evan Mulawski
回答by Pramod
div[disabled]
{
pointer-events: none;
opacity: 0.7;
}
The above code makes the contents of the div disabled. You can make div disabled by adding disabled attribute.
上面的代码使 div 的内容被禁用。您可以通过添加 disabled 属性来禁用 div。
<div disabled>
/* Contents */
</div>
回答by monknomo
Using jquery you might do something like this:
使用 jquery 你可能会做这样的事情：
// To disable
$('#targetDiv').children().attr('disabled', 'disabled');
// To enable
$('#targetDiv').children().attr('enabled', 'enabled');
Here's a jsFiddle example: http://jsfiddle.net/monknomo/gLukqygq/
这是一个 jsFiddle 示例：http: //jsfiddle.net/monknomo/gLukqygq/
You could also select the target div's children and add a "disabled" css class to them with different visual properties as a callout.
您还可以选择目标 div 的子项，并为它们添加一个“禁用”的 css 类，并使用不同的视觉属性作为标注。
//disable by adding disabled class
$('#targetDiv').children().addClass("disabled");
//enable by removing the disabled class
$('#targetDiv').children().removeClass("disabled");
Here's a jsFiddle with the as an example: https://jsfiddle.net/monknomo/g8zt9t3m/
这是一个以 jsFiddle 为例：https://jsfiddle.net/monknomo/g8zt9t3m/
回答by Vayodya Tamari
if you want to hide a whole div from the view in another screen size. You can follow bellow code as an example.
如果你想在另一个屏幕尺寸的视图中隐藏整个 div。您可以按照以下代码作为示例。
div.disabled{
display: none;
}
