Javascript 允许contenteditable在dom修改后撤消

有没有一种方法可以使用javascript修改contenteditable的元素，从而使撤消仍然有效

似乎可以做到这一点，在选择一些文本后尝试单击粗体按钮，我浏览了它的源代码，不知道它们是如何做到的，唯一提到的是在

halloreundo

中，这是一些gui工具栏

---

我已经看过了，但这只是将html保存在一个数组中，这将真正限制撤消堆栈的大小，因此如果可能的话，我想要一个本机解决方案。

您可以通过而不是直接的DOM操作来确保编辑操作的撤消能力

---

检查这个显示了bold命令的小演示（当然可以撤消）：

这段代码将保存对数组中可编辑内容的所有更改。您可以通过调用

save_history（）

手动保存当前状态，或将此函数附加到任何事件（例如-on

keydown

）。我对状态相等的检查进行了编码，所以如果您在单击事件时绑定save_history，那么如果您在编辑器中单击10次而不做任何更改，它将不会保存10个状态。此代码将在每个能够运行jQuery的浏览器中运行：

//用于存储画布对象历史记录的数组
canvas_history=[]；
s_历史=真实；
当前历史指数=0；
DEBUG=true；
//在历史记录数组中存储画布的每次修改
功能保存历史（强制）{
//如果我们已经使用了撤消按钮并进行了修改-删除所有转发历史记录
如果（cur_history_index如其他人所述，简短的回答是使用document.execCommand保留浏览器的撤消/重做。如果您需要以任何方式以编程方式无法编辑文本（如支持多行制表符缩进或其他操纵文本的快捷方式），则应使用document.execCommand（'insertHTML'））或“insertText”，当您设置新的文本状态时。insertText将在编辑时创建新的div子级，这可能会很麻烦，而“insertHTML”则不会（但是“insertHTML”有一些IE支持问题，您可能必须解决，在别处有详细说明）

这一部分让我陷入了一个巨大的循环，这就是为什么我要写一个新的答案，因为我在任何地方都没有发现它：

您可能还需要捕获粘贴事件，并将其转换为execCommand（'insertHTML'），或者在粘贴后可能进行的任何编程选择更改（如重置光标等）冒着向您抛出错误的风险，指出该节点的长度不足以进行新选择，尽管它明显不够长。粘贴后，DOM不知何故无法识别yourDiv.firstNode的新长度，但它会在您使用execCommand（'insertHTML'）后进行更新。可能还有其他解决方案，但这是一个简单的解决方案：


$（“#myDiv”）.on（'paste'，函数（e）{
e、 预防默认值（）；
var text=e.originalEvent.clipboardData.getData（“text/plain”）；
document.execCommand（“insertHTML”，false，text）；
})；