Question

在CKEditor中，我在添加一些dataProcessor规则时遇到问题。

我有一个在ckeditor / pluggsin / x中定义的自定义插件我已将插件名称添加到config.js extraPlugins

我的插件看起来像

CKEDITOR.plugins.add('x',   
  {    

    init:function(editor)
    { 
        editor.dataProcessor.htmlFilter.addRules(
        {
            elements :
            {
                div : function( element )
                {
                    element.setAttribute("x","y");
                }
            }
        });

        editor.dataProcessor.dataFilter.addRules(
        {
            elements :
            {
                div : function( element )
                {
                    element.setAttribute("x","y");
                }
            }
        });

});

但是它不会插入属性。

我在这里做错了吗？

Answer 1

CKEDITOR.dataProcessor适用于CKEDITOR.htmlParser.element而不是CKEDITOR.dom.element。 CKEDITOR.htmlParser.element不是真正的DOM元素，而是一个抽象对象，使解析和过滤更容易。它有自己的一套方法和属性。

另请注意，dataFilter适用于输入数据（来自编辑器的内容），htmlFilter处理输出数据（编辑器生成的内容）。

您还应该习惯Allowed Content Filter，因为您很可能需要对其进行配置以使编辑器正常工作，即config.extraAllowedContent = 'div[x]'。

请参阅fiddle。

CKEDITOR.replace( 'editor', {
    extraAllowedContent: 'div',
    on: {
        pluginsLoaded: function() {
            this.dataProcessor.dataFilter.addRules( {
                elements: {
                    div: function( el ) {
                        console.log( 'processing', el, 'in dataFilter' );
                        el.attributes.datafilter = 'x';
                    }
                }
            } );    

            this.dataProcessor.htmlFilter.addRules( {
                elements: {
                    div: function( el ) {
                        console.log( 'processing', el, 'in htmlFilter' );
                        el.attributes.htmlfilter = 'y';
                    }
                }
            } );              
        }
    }
} );

CKEditor - 添加自定义属性

1 个答案: