检测文本何时更改并且编辑器在CKEditor 5中失去了焦点 [英] Detect when text has changed AND editor has lost focus in CKEditor 5

查看:142
本文介绍了检测文本何时更改并且编辑器在CKEditor 5中失去了焦点的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I'm trying to implement an autosave feature in CKEditor 5, where a save only occurs if changes were made and after the editor has lost focus.

我该怎么做?文档对我来说非常混乱。

How could I do this? The documentation has been very confusing to me.

这是我最近得到的内容:

This is the closest I've gotten:

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

onChange(el,editor);

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

The problem with my solution is the blur event fires whenever CKEditor brings up a modal.

推荐答案

以跟踪编辑器ui ,则可以使用 focusTracker (在 editor.ui.focusTracker 上可用)。

To track the focused element of the editor ui you can use the focusTracker (available on editor.ui.focusTracker). It tracks various parts of the editor that are currently focused.

focusTracker.isFocused true true 。对于经典编辑器构建,关注的元素可能是一个的:

The focusTracker.isFocused is true whenever any of the editor's registered components are focused. For the classic editor build the focused elements might be one of:


  • 编辑区域,

  • 工具栏,

  • 上下文工具栏。

editor.ui.focusTracker.on( 'change:isFocused', ( evt, name, isFocused ) => {
    if ( !isFocused ) {
        // Do whatever you want with current editor data:
        console.log( editor.getData() );
    }
} );

这篇关于检测文本何时更改并且编辑器在CKEditor 5中失去了焦点的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆