Javascript:为文本区域导出浏览器的 native 撤消/重做堆栈

Question

是否有任何方法可以为文本区域导出/保存任何浏览器的 native 撤消/重做堆栈？我希望能够在事后撤消/重做文本区域中的所有输入。

我还想使用 javascript 调用 native 撤消/重做堆栈，这很容易通过以下方式完成:

$('#textarea_im_using').focus();
document.execCommand('undo', false, null); 

但是，这导致控制台中出现 NS_ERROR_FAILURE: Failure 错误消息。有什么想法吗？

简而言之，我有两个问题:

1. 导出 native 浏览器的撤消堆栈
2. 调用 native 浏览器的撤消方法。

我目前使用的是 Mozilla Firefox(最新版本)。我很乐意尝试任何可用的浏览器(Safari 除外)。

Answer 1

执行命令，according to MDN , 与文档设计模式或 contentEditable 元素有关，而不是像 textarea 这样的表单字段。

使用 contentEditable div 可以让您完成您想要完成的事情。当然，在支持它的浏览器上，它可以让您以编程方式触发 undo 操作，而且我相信您对 contentEditable div 有更多的控制权而不是在 textarea 上。

Live Example :

HTML:

<p>Edit me:</p>
<div id="editor"></div>
<button id="buttonUndo">Undo</button>

CSS:

#editor {
  border: 1px solid black;
  min-height: 2em;
}

JavaScript:

var editor = document.getElementById("editor");
var buttonUndo = document.getElementById("buttonUndo");
editor.contentEditable = true;
buttonUndo.onclick = function() {
  document.execCommand("undo", false, null);
};

(使用 onclick 因为 IE8 支持这个东西，我不想玩 addEventListener/attachEvent 游戏...)