使用Ctrl-A（全选）编辑可信任文本，删除所有子元素 [英] Edit contenteditable text with Ctrl-A (Select All) removing all child elements

问题描述

在具有contenteditable =true的div中，如果我使用Ctrl-A选择所有文本然后键入内容，它将删除div中的所有子元素，而不仅仅是文本。

In a div with contenteditable="true", if I select all text using Ctrl-A and then type something, it will removing all the child elements within the div, not just the text.

例如：

<div id="texteditor" contenteditable="true">
   CTRL-A and Edit Me.

   <div id="topleft-ornament" class="ornament"></div>
   <div id="topright-ornament" class="ornament"></div>
   <div id="bottomleft-ornament" class="ornament"></div>
   <div id="bottomright-ornament" class="ornament"></div>
</div>

小提琴：
http://jsfiddle.net/7jV4f/1/

红色圆圈（contenteditable div的子元素） ）如果使用Ctrl-A编辑文本，上面的示例将被删除。

the red circles (child elements of contenteditable div) in the example above will be removed if the text is edited using Ctrl-A.

任何想法如何防止它？

thx：D

推荐答案

所以将文本包装在div中并指定 contenteditable 该特定元素的属性

So wrap the text inside the div and assign contenteditable attribute to that particular element

演示

<div contenteditable="true">CTRL-A and Edit Me.</div>
<!-- Wrap the text, don't use contenteditable for the parent element -->

这篇关于使用Ctrl-A（全选）编辑可信任文本，删除所有子元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！