javascript - 在 contenteditable 部分中使 h2 标记不可移除

Question

是否可以使 contenteditable 元素中的部分永久化，以便用户无法删除它？

我在 contentEditable div 中有一个 h2 标签。我不希望用户编辑 h2 标签，所以我设置了 contentEditable=false，但用户仍然可以选择和删除它，我想禁止它。

所以，例如：

<div contentEditable="true">
  <h2 contentEditable="false">My h2 tag</h2>
  This is a div you can edit. But you can't edit or remove the h2 tag.
</div>

Answer 1

不，对不起，这是全有或全无。

一种解决方法是获取 H2 标记并在编辑完成后使用 JavaScript 重新插入它。

Answer 2

为什么不使用position:absolute将它移到 div 上方（可能使用适当的 div z-index）而不在其中（在源代码中）？
请记住在为您的 h2 分配的空间中为您的 div 添加一些填充。