有没有办法在运行上向 CKEditor 的 link 插件添加按钮？

Question

在运行上有一些方法可以为 CKEditor 的工具栏添加功能。例如，

How to add a custom button to the toolbar that calls a JavaScript function?

并且有一些方法可以向现有的 link CKEditor

插件添加新的选择

https://ssdtutorials.com/courses/ckeditor-internal-page-link

http://blog.xoundboy.com/?p=393

有没有办法将按钮添加到运行上现有的 link 插件？我有一个按钮要添加到依赖于用户数据的 link 插件，因此必须将按钮添加到运行.

Answer 1

我使用了 internpage plugin 并更改了源以支持动态更改出现的 link 列表。在上面 link 的代码中，您看到他们定义了一个设置函数，每次打开对话框并显示 select 时都会调用该函数：

setup : function (f) {
    this.allowOnChange = false;
    this.setValue(f.url ? f.url.url : '');
    this.allowOnChange = true;
}

您需要做的就是使用可用的方法更改或刷新 select 中的项目列表：

this.clear() - 删除 select
this.remove(index) - 删除 select
this.add(text,url) - 在 select
this.getElement() - 获取实际的 select 元素

请注意，使用这些方法时 this.items 保持不变，因此您可以使用属性自动刷新 select。

这是一个工作演示：https://jsfiddle.net/ud4csxyc/

按几次红色按钮，您将看到项目列表已更改。

希望是你想要的。

Answer 2

我需要它来根据上下文自定义 CKE。绘制 CDN 版本时也很有用。举个例子：

// Must be called before first editor instance creation (i.e. CKEDITOR.replace() action).
function registerPlugin()
{
    // Exit if CKEDITOR not present
    if (typeof CKEDITOR == undefined) return;

    var pluginName = 'filegator'

    // Exit if plugin already registered
    if(CKEDITOR.config.extraPlugins.search(pluginName) >= 0) return;

    // (1) Append plugin in config
    CKEDITOR.config.extraPlugins += ',' + pluginName;
    // FYI: To change entire CKE default config use:
    // CKEDITOR.config = {your config here, like this found in config.js};

    // (2) Register the plugin within the editor.

    // (2a) File version
    //CKEDITOR.plugins.addExternal( 'filegator', 'ckeditor/plugins/filegator/', 'plugin.js' );

    // (2b) Inline version
    CKEDITOR.plugins.add(pluginName, {

        // Register the icons. They must match command names.
        //icons: 'openFilegator',

        // The plugin initialization logic goes inside this method.
        init: function( editor ) {

            // Define the editor command that inserts a timestamp.
            editor.addCommand( 'openFilegator', {

                // Define the function that will be fired when the command is executed.
                exec: function( editor ) {
                    var now = new Date();
                    // Insert the timestamp into the document.
                    editor.insertHtml( 'The current date and time is: <em>' + now.toString() + '</em>' );
                }
            });

            // Create the toolbar button that executes the above command.
            editor.ui.addButton( 'Filegator', {
                label: 'Open Filegator',
                command: 'openFilegator',
                toolbar: 'links',
                className: 'cke-openFilegator',
                icon: '/iframes/openFilegator.png',
            });
        }
    });
}

然后在某处，在 <script src="//cdn.ckeditor.com/4.9.0/standard/ckeditor.js"></script> 之后：

registerPlugin();
// Replace the <textarea id="editor1"> with a CKEditor instance.
CKEDITOR.replace( 'editor1' );        
CKEDITOR.replace( 'editor2' );
CKEDITOR.replace( 'editor3' );
// etc.

有没有办法在运行上向 CKEditor 的 link 插件添加按钮？

Is there a way to add button to link plugin of CKEditor on the run?

javascript

ckeditor

有没有办法在 运行 上向 CKEditor 的 link 插件添加按钮？

Is there a way to add button to link plugin of CKEditor on the run?

javascript

ckeditor

有没有办法在运行上向 CKEditor 的 link 插件添加按钮？