0

我有一些这样的div：

<div id="op" contentEditable="true">hello<div class="dynamic">......sth
</div> <div class="dynamic"> ...sth
</div> .......<div class="dynamic"> </div>.. <div class="dynamic"> </div>..</div>

id 为“op”的 div 中的 div 是动态创建的，并使用 appendChild 方法附加到“op”。添加所有动态div后，我需要将div“op”的contentEditable更改为false，而将“op”内部的div更改为true。基本上，话虽如此，我的目标是能够修改具有真正 contentEditable 的 div，但将其附加到具有 false contentEditable 的 div 上。我这样做了：

document.getElementById("op").setAttribute("contentEditable",false);
document.getElementsByClassName("dynamic").setAttribute("contentEditable",true);

这不起作用，我认为原因很简单。虽然我修改了“动态”类 div 的 contentEditable，但它们仍然在具有错误 contentEditable 的 div 内。

是否有任何方法可以覆盖父 contentEditable 属性，以便它允许其子级在拥有它时保留自己的 contentEditable 并应用父级内容 Editable 否则？

4

1 回答 1

1

您是否将 contentEditable 属性设置为“动态”类的 div false？true在您的代码段中，您将所有 div 设置为false.

contentEditable的默认值（当它丢失时）是inherit. 因此，当您将元素的 contentEditable 设置为 时，该元素的true所有子元素也将是内容可编辑的。

给定以下 HTML，您可以编辑所有文本，甚至可以意外删除子项div：

<div id="parent" contenteditable="true">
    Parent div
    <div id="child"><!-- contentEditable="true" is implied -->
        Child div
    </div>
</div>

使用此 HTML，您只能编辑文本“父 div”：

<div id="parent" contenteditable="true">
    Parent div
    <div id="child" contenteditable="false">
        Child div
    </div>
</div>
于 2013-07-17T13:33:26.360 回答