在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
沃梦达教程
本文标题为:CKEditor编辑器allowedContent过滤器规则设置教程


基础教程推荐
猜你喜欢
- webpack学习笔记一:安装webpack、webpack-dev-server、内存加载js和html文件、loader处理非js文件 2023-10-29
- JSONObject与JSONArray使用方法解析 2024-02-07
- Bootstrap学习笔记之css组件(3) 2024-01-22
- 纯css实现漂亮又健壮的tooltip的方法 2024-01-23
- Django操作cookie的实现 2024-04-15
- html5视频如何嵌入到网页(视频代码) 2025-01-22
- js判断一个对象是否在一个对象数组中(场景分析) 2022-10-21
- 创建Vue3.0需要安装哪些脚手架 2025-01-16
- Loaders.css免费开源加载动画框架介绍 2025-01-23
- clientX,pageX,offsetX,x,layerX,screenX,offsetLeft区别分析 2024-01-08