收听ckeditor小部件事件

Listen on ckeditor widget events

本文关键字：事件 小部 ckeditor 收听      更新时间：2023-09-26

我尝试扩展简单的box小部件教程(http://docs.ckeditor.com/#/guide/widget_sdk_tutorial_1），但我并不真正理解。我的目标之一是，如果小部件中的一个可编辑字段（例如simplebox标题）聚焦，则触发一个事件。但不幸的是，只有当小部件本身变得专注时，我才能收听：

editor.widgets.add('simplebox', {
            // definitions for
            // button, template, etc
            init: function() {
                this.on('focus', function(ev){
                    console.log('focused this');
                });
            }
        });

或者如果数据发生变化：

CKEDITOR.plugins.add('simplebox', {
// my plugin code
init: function (editor) {    
    editor.widgets.on( 'instanceCreated', function( evt ) {
        var widget = evt.data;
        widget.on('data', function(evt){
            console.log("data changed");
        });
    });
}
//even more code
});

如何收听小部件中的可编辑字段？对我来说，另一个挑战是，如果小部件被删除，就触发一个事件。也许有人也知道如何倾听这个事件？

如何收听小部件中的可编辑字段？

小部件中没有可编辑字段的事件。它们的行为类似于主可编辑对象，因此当您更改其中的某些内容时，editor#change事件将被激发。

对我来说，另一个挑战是，如果小部件被删除，就触发一个事件。

有widget#destroy事件，但您不会发现它非常有用。原因是小部件在删除时并不总是被销毁，因为有很多方法可以做到这一点

如果您在选择小部件时按下退格，则是-此事件将被触发，因为删除是直接在小部件上进行的。但是，它是在小部件被删除后被激发的。

如果您选择编辑器的全部内容并按退格，则浏览器会将其删除，因为在这种情况下浏览器会处理此键。因此，CKEditor实现了一个小型垃圾收集器，它会不时检查哪些小部件实例被删除并销毁。您可以通过更频繁地调用editor.widgets.checkWidgtes()来增加频率，例如在editor#change上，但它不会改变任何内容。在这两种情况下，都会在删除小部件后触发事件。

相关文章：