如何在具有某些内置功能的ckeditor小部件上添加按钮？

问题描述

我已经修改了中提供的simplebox小部件，以包括这些悬停按钮上的三个按钮。

I have modified the simplebox widget given in this widget tutorial to include these three buttons on hover.

我想在这些按钮中启用某些功能，即在其click事件上运行一些javascript。例如。使用删除按钮，小部件实例被销毁（通过查看文档，我发现了小部件的destroy方法）。但是我应该如何在该按钮的click事件上附加该方法。

I want to enable some functionality in these buttons, i.e. run some javascript on their click event. E.g. With delete button the widget instance gets destroyed (looking through doc I found the destroy method for widget). But how I should go about attaching that method on this button's click event.

还想知道，如何在CKEditor中停止事件冒泡（event.stopPropagation），以阻止其他事件继续发生点击事件。

Also wanted to know, how to stop event bubbling (event.stopPropagation) in CKEditor to stop further events from happening on the click event.

任何建议都会有所帮助。

Any advice will be helpful. Have been struggling with this for long.

是的，这个编辑器动摇了。 ：）

And yes, this editor rocks. :)

推荐答案

我是通过将以下代码插入 editor.widgets.add（'simplebox '，{初始化属性。

I did it by inserting the following code in editor.widgets.add( 'simplebox', { init property.

that = this;
buttons = this.element.getElementsByTag("button");

//getItem(2) points to the third button element which is delete
buttons.getItem(2).on("click", function() {
    //destroys the dom of the widget
    that.wrapper.remove();
    //destroys widget from memory
    CKEDITOR.instances.editor1.widgets.destroy(that, true);
});

wrapper.remove （）删除小部件的dom元素，而下一行破坏小部件的实现。

wrapper.remove() removes dom elements of the widget and the next line destroys widget implementation.

这篇关于如何在具有某些内置功能的ckeditor小部件上添加按钮？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！