Question

我想在CKEditor 5中听取焦点事件。

我认为这样的东西会起作用，但回调永远不会被调用：

document.querySelector("#editable");
ClassicEditor.create(el).then(editor => {
    editor.on('focus', () => {
        console.log("Focused");
    });
});

编辑器已成功创建，但未调用回调。

有什么想法吗？

Answer 1

为此目的，编辑器附带了FocusTracker（以及可观察的#isFocused属性）：

editor.ui.focusTracker.on( 'change:isFocused', ( evt, name, value ) => {
    console.log( 'isFocused = ', value );
} );

请注意，只要任何用户界面具有焦点，editor.ui.focusTracker.isFocused为true，其中包括可编辑的，但也包括工具栏，浮动面板等。

要确定可编辑的focus，即当插入符号闪烁且可以输入时，请使用此侦听器：

editor.editing.view.document.on( 'change:isFocused', ( evt, name, value ) => {
    console.log( 'editable isFocused =', value );
} );

将一个侦听器放在另一个旁边，然后使用编辑器和UI来查看差异。

如何在CKEditor 5中收听焦点事件

1 个答案: