2

我创建了只插入外部图像的自定义图像插件。但是，如果我禁用默认图像插件，则 img 标签不会出现在表单中。为什么 ？

这是我的插件：

CKEDITOR.plugins.add( 'img',
{
    init: function( editor )
    {
        editor.addCommand( 'insertImg',
            {
                exec : function( editor )
                {    
                    var imgurl=prompt("Insert url image");
                    editor.insertHtml('<img src="'+imgurl+'" />');
                }
            });
        editor.ui.addButton( 'img',
        {

            label: 'Insert img',
            command: 'insertImg',
            icon: this.path + 'images/aaa.png'
        } );
    }
} );
4

2 回答 2

3

您需要将您的插件与 CKEditor 4.1 中引入的 ACF - 高级内容过滤器集成。

这是一个有用的指南 - Plugins integration with ACF。

基本上，您正在向编辑器介绍一项功能。这个特性需要告诉编辑器它在 HTML 中是如何表示的，所以当这个特性启用时应该允许什么。

在最简单的情况下，当您有一个执行命令的按钮时，您只需要定义CKEDITOR.feature界面的两个属性：allowedContent和requiredContent.

例如：

editor.addCommand( 'insertImg', {
    requiredContent: 'img[src]', // Minimal HTML which this feature requires to be enabled.
    allowedContent: 'img[!src,alt,width,height]', // Maximum HTML which this feature may create.
    exec: function( editor ) {    
        var imgurl=prompt("Insert url image");
        editor.insertHtml('<img src="'+imgurl+'" />');
    }
} );

现在，当此按钮添加到工具栏时，将自动启用功能并允许使用图像。

于 2013-07-08T08:28:09.573 回答
0

您在 addButton 配置中设置了错误的命令名称。你需要设置：

editor.addCommand( 'insertImg', {
         ...
     }
);

以及command配置的名称editor.ui.addButton()

UPD： 一些小提琴：http: //jsfiddle.net/kreeg/2Jzpr/522/

于 2013-07-07T05:54:10.173 回答