javascript - CKEditor ul ol 外壳

Question

全部！CKEditor 有问题！我需要用 div 将 ul、ol 列表括起来。所以当我按下面板上的列表按钮时，我会得到这样的结果：

 <div class=”dash-list”&gt;
     <ul>
          <li></li>
     </ul>
 </div>

Answer 1

无需重写list插件的最简单方法是在编辑器输出中包装列表：

var wrappable = [];

var editor = CKEDITOR.replace( 'editor1', {
    on: {
        instanceReady: function() {
            this.on( 'toDataFormat', function( evt ) {
                var el, wrap;

                while ( ( el = wrappable.pop() ) ) {
                    wrap = el.parent;

                    // Abort if already wrapped...
                    if ( wrap && wrap.type == CKEDITOR.NODE_ELEMENT && wrap.attributes[ 'class' ] == 'dash-list' )
                        return wrap;

                    // Wrap el...    
                    wrap = new CKEDITOR.htmlParser.element( 'div', { 'class': 'dash-list' } );
                    el.replaceWith( wrap );
                    wrap.add( el );
                }
            }, null, null, 11 );

            this.dataProcessor.htmlFilter.addRules( {
                elements: {
                    ul: function( element ) {
                        wrappable.push( element );
                    },
                    ol: function( element ) {
                        wrappable.push( element );
                    }
                }
            } );
        }
    }
} );