如何使用撤消管理器确定文档是否有未保存的更改

How to use the UndoManager to determine if document has unsaved changes

本文关键字：保存 是否 文档 撤消 何使用 管理器      更新时间：2023-09-26

我对ACE编辑器和javascript很陌生，但是除了以下内容之外，我已经设法实现了我想要的大部分目标：

我想启用或禁用"保存"按钮，具体取决于文档是否有未完成的修改，并且我尝试使用"更改"事件执行此操作： 

UndoManager.reset();
$('#save').addClass("disabled");
editor.on('change', function() {
        if (UndoManager.hasUndo()) {
            $('#save').removeClass("disabled");
        }
        else {
            $('#save').addClass("disabled");
        }
    });

加载文档时，"禁用"类会立即删除。

如果有人可以告诉我应该如何做，非常感谢。

加载文档后调用editor.session.getUndoManager().reset()并在undoManager上使用isClean、markClean方法。

var saveButton = document.getElementById("save")
var editor = ace.edit("editor")
// using input event instead of change since it's called with some timeout
editor.on("input", function() {
    saveButton.disabled = editor.session.getUndoManager().isClean()
});
saveButton.addEventListener("click", function() {
    editor.session.getUndoManager().markClean()
    saveButton.disabled = editor.session.getUndoManager().isClean()
})
<script src="http://ajaxorg.github.io/ace-builds/src/ace.js"></script>
<button id="save">save</button>
<div id="editor" style="height:200px"></div>

您的解决方案有一个缺点：保存后，您无法撤消。大多数现代编辑器允许在保存后撤消。

我建议你记录下原文，并在文本发生变化时进行比较。 如果文本等于原点，请禁用保存按钮。

相关文章：