Question

我试图扩展简单的框小部件教程（http://docs.ckeditor.com/#!/guide/widget_sdk_tutorial_1）有一些事件，但我并没有真正得到它。我的目标之一是在窗口小部件中的可编辑（例如，简单框标题）字段得到关注时触发事件。但不幸的是，我只能听取小部件本身的重点：

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
});

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

Answer 1

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

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

对我来说，另一个挑战是在移除小部件时触发事件。

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

如果在选择窗口小部件时按 backspace ，则是 - 此事件被触发，因为直接在窗口小部件上进行删除。但是，在删除小部件后会触发它。

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

收听ckeditor小部件事件

1 个答案: