检测 CKEditor 5 中文本何时发生更改并且编辑器失去焦点

2024-01-05

我正在尝试在 CKEditor 5 中实现自动保存功能,只有在进行更改且编辑器失去焦点后才会进行保存。

我怎么能这样做呢?该文档让我非常困惑。

这是我得到的最接近的:

function onChange(el,editor) {
    editor.document.once('change',function(evt,data) {
        $(el).one('blur',function() {
            saveFunction();
            onChange(el,editor);
        });
    });
}

onChange(el,editor);

我的解决方案的问题是每当 CKEditor 调出模态时就会触发模糊事件。


跟踪焦点元素编辑器用户界面 https://docs.ckeditor.com/ckeditor5/latest/api/module_core_editor_editorui-EditorUI.html你可以使用焦点追踪器 https://docs.ckeditor.com/ckeditor5/latest/api/module_core_editor_editorui-EditorUI.html#member-focusTracker(可用于editor.ui.focusTracker)。它跟踪编辑器当前关注的各个部分。

The focusTracker.isFocused https://docs.ckeditor.com/ckeditor5/latest/api/module_utils_focustracker-FocusTracker.html#member-isFocused is true每当编辑器的任何注册组件获得焦点时。为了经典编辑器构建 https://docs.ckeditor.com/ckeditor5/latest/examples/builds/classic-editor.html重点元素可能是以下之一:

  • 编辑区,
  • toolbar,
  • 上下文工具栏。
editor.ui.focusTracker.on( 'change:isFocused', ( evt, name, isFocused ) => {
    if ( !isFocused ) {
        // Do whatever you want with current editor data:
        console.log( editor.getData() );
    }
} );
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

检测 CKEditor 5 中文本何时发生更改并且编辑器失去焦点 的相关文章

随机推荐