javascript - 浏览器中撤消的事件监听器

Question

为了提供上下文，我的团队正在构建一个 富文本编辑器 在需要在 session 之间将状态持久化到服务器的浏览器中。编辑器的状态显然可以从更新到包含 keydown 事件的文档发生变化，但我们也应该考虑 由撤消/重做事件触发的编辑器阶段更新 .

不幸的是，浏览器有 没有 native 撤消/重做事件 (ref)。一个提议hack除了禁用上下文菜单之外， float 似乎是为了停止映射到撤消的键盘快捷键的 keydown 事件的传播。但是，这仍然为用户提供了 的功能。直接导航到 Edit -> Undo在应用程序的菜单栏中 ，这将直接触发 document.execCommand('undo')并且不会触发事件。结果，我们不知道向服务器发送更新。

这是 W3C thread在这个问题上。在撰写本文时，似乎仍在制定解决方案......

当Quill ，另一个浏览器文本编辑器，遇到了这个问题，他们的团队似乎 advise :“禁用 native 撤消/堆栈”，这是 Facebook 的 Draft.js实际上does .鉴于这似乎是我们正在使用的，有没有人知道 的方法？禁用/替换浏览器的 native 撤消/重做堆栈 ?显然，这是一个激进的解决方案，但在撰写本文时，这似乎是唯一的选择。

与此同时，这个问题的答案可能隐藏在草案代码的某个地方。如果没有人击败我的团队，我会报告 Draft 似乎在做什么。认为至少值得记录这个问题。

Answer 1

可能最好的解决方案是收听去抖 onChange来自 contentEditable 的事件元素。这不允许有关撤消的自定义行为，但它应该解决主要问题。同时添加 beforeunload 提醒用户注意潜在未保存更改的事件应该处理额外的边缘情况。