单击CK编辑器工具栏上的获取UI按钮

Get UI button clicked on CK Editor toolbar

本文关键字:获取 UI 按钮 CK 编辑器 工具栏 单击      更新时间:2023-09-26

我为CK Editor构建了一个非常简单的插件(因为这显然是向工具栏添加自定义按钮的唯一方法?)

我想知道当我的自定义按钮被点击时,我如何获得它的DOM ID(或者任何代表按钮的对象,它将允许我创建一个jQuery对象)

(function () {
    CKEDITOR.plugins.add('myplugin', {
        icons: 'myicon',
        hidpi: true,
        init: function (editor) {
            editor.addCommand('mycommand', {
                exec : function(editor) {
                    // get button information
                }
            });
            editor.ui.addButton && editor.ui.addButton('MyCommand', {
                label: 'Custom Action',
                command: 'mycommand',
                toolbar: 'insert,5',
                icon: 'myicon'
            });
        }
    });
})();

我想在单击按钮时将我自己的自定义UI元素附加到工具栏上,并且我需要一个相对的锚点才能在屏幕上的正确位置显示它。

我使用的是CK Editor 4.2

在您的情况下,您可以使用以下代码(使用jQuery)访问按钮:

$(document).on('click', '.cke_button__mycommand', function(){
    // do stuff
});

您可以使用浏览器检查工具栏以获取更多信息。