CKEditor编辑器allowedContent过滤器规则设置教程

在CKEditor中有个allowedContent属性，主要功能是规定编辑内容允许的标签、标签的属性（attributes）、标签的样式（style）以及可以使用的类（class），默认为开启状态，可以通过在config.js文件中配置，如果要禁用内容过滤，只需要找到ckeditor/config.js配

在CKEditor中有个allowedContent属性，主要功能是规定编辑内容允许的标签、标签的属性（attributes）、标签的样式（style）以及可以使用的类（class），默认为开启状态，可以通过在config.js文件中配置，如果要禁用内容过滤，只需要找到ckeditor/config.js配置文件中添加如下代码：

config.allowedContent=true

CKEditor编辑器在开启过滤器状态下，可以详细设置各种过滤规则，比如设置允许哪些标签，只允许带哪些属性的标签、过滤什么标签、过滤什么属性、过滤什么样式等。
比如禁用图片img属性中的宽高（width，height），规则如下：

config.disallowedContent = 'img{width,height};img[width,height]';

当然禁用图片img属性中的宽高（width，height）也可以在config.js中添加如下代码，找到：

CKEDITOR.editorConfig = function( config ) {
…….代码段….
}; 

在这段的下面添加如下代码：

CKEDITOR.on('dialogDefinition', function(ev) {
        var dialogName = ev.data.name;
        var dialogDefinition = ev.data.definition;
        var editor = ev.editor;
        if (dialogName == 'image') {
           dialogDefinition.onOk = function(e) {
              var imageSrcUrl = e.sender.originalElement.$.src;
              var imageAlt = $('#title').val();
              var imgHtml = CKEDITOR.dom.element.createFromHtml("<img src="" + imageSrcUrl + "' alt="" + imageAlt + "'/>");
              editor.insertElement(imgHtml);
           };
        }
});

设置允许某些标签：

config.extraAllowedContent = 'span;ul;li;table;td;style;*[id];*(*);*{*}';

更多详细过滤器规则可参考CKEditor官方文档
http://docs.ckeditor.com/#!/guide/dev_allowed_content_rules