Javascript 如何使用 CKeditor 允许所有 html 标签和属性？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28840414/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to allow all html tags and attributes with CKeditor?
提问by HddnTHA
I'm trying to allow all html tags
我正在尝试允许所有 html 标签
<div> <p> <span> <i> /* etc */
and html attributes like below (class, id) for eg:
和 html 属性如下（类，id）例如：
<div id="foo" class="bar" style="z-index:1;">SOME COOL CONTENT HERE</div>
in ckeditor.
在 ckeditor 中。
I found something like in docs.ckeditor.com
我在 docs.ckeditor.com 中找到了类似的东西
config.allowedContent = {
: {
// Use the ability to specify elements as an object.
elements: CKEDITOR.dtd,
attributes: true,
styles: true,
classes: true
}
};
config.disallowedContent = 'script; *[on*]';
and added it to config.jsin ckeditor's root folder. But nothing changed. When i'm trying to add some html tags on ckeditor's source code block it's erasing all of html contents.
并将其添加到config.jsckeditor的根文件夹中。但什么都没有改变。当我试图在 ckeditor 的源代码块上添加一些 html 标签时，它会擦除所有 html 内容。
What am i missing? Thanks in advance.
我错过了什么？提前致谢。
Version: ## CKEditor 4.4.7
版本：## CKEditor 4.4.7
EDIT & UPDATE:
编辑和更新：
After @Eelke and @Necreaux answers i added allowedContent = truein my config.js. Now basic html elements such <div> <span> <h3>working perfectly. But ckeditor still striping <i>tags.
在@Eelke 和@Necreaux 回答之后，我allowedContent = true在我的 config.js 中添加了答案。现在基本的 html 元素可以<div> <span> <h3>完美地工作。但是 ckeditor 仍然对<i>标签进行条带化。
Completely Config JS
完全配置JS
CKEDITOR.editorConfig = function( config ) {
config.allowedContent = true;
config.removeFormatAttributes = '';
// Define changes to default configuration here.
// For complete reference see:
// http://docs.ckeditor.com/#!/api/CKEDITOR.config
// The toolbar groups arrangement, optimized for two toolbar rows.
config.toolbarGroups = [
{ name: 'clipboard', groups: [ 'clipboard', 'undo' ] },
{ name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ] },
{ name: 'links' },
{ name: 'insert' },
{ name: 'forms' },
{ name: 'tools' },
{ name: 'document', groups: [ 'mode', 'document', 'doctools' ] },
{ name: 'others' },
'/',
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
{ name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
{ name: 'styles' },
{ name: 'colors' },
{ name: 'about' }
];
// Remove some buttons provided by the standard plugins, which are
// not needed in the Standard(s) toolbar.
config.removeButtons = 'Underline,Subscript,Superscript';
// Set the most common block elements.
config.format_tags = 'p;h1;h2;h3;pre;';
// Simplify the dialog windows.
config.removeDialogTabs = 'image:advanced;link:advanced';
};
采纳答案by Reinmar
The first thing is why some elements, attributes, styles and classes are removed regardless of their content. This is caused by the Advanced Content Filter. See this question for more details about how to change its settings: CKEditor automatically strips classes from div
首先是为什么一些元素、属性、样式和类被删除而不管它们的内容如何。这是由高级内容过滤器引起的。有关如何更改其设置的更多详细信息，请参阅此问题： CKEditor 自动从 div 中剥离类
Another thing is why empty inline elements are removed regardless of whether they are allowed or not. This question was also asked already - see CKEditor strips <i> Tag- note there's more that one good answer there.
另一件事是为什么无论是否允许空行内元素都会被删除。这个问题也问已经-见CKEditor的条<i>标签-注有更多的一个很好的答案在那里。
回答by Eelke
If everything is allowed, you can use allowedContent = true
如果一切都被允许，你可以使用 allowedContent = true
回答by Necreaux
Have you tried the following?
您是否尝试过以下方法？
config.allowedContent = true;
config.removeFormatAttributes = '';
回答by no81no
these are the tags CKEditor 4 removes when empty:
这些是 CKEditor 4 在为空时删除的标签：
abbr, acronym, b, bdi, bdo, big, cite, code, del, dfn, em, font, i, ins, label, kbd, mark, meter, output, q, ruby, s, samp, small, span, strike, strong, sub, sup, time, tt, u, var
abbr, 首字母缩略词, b, bdi, bdo, big, cite, code, del, dfn, em, font, i, ins, label, kbd, mark, meter, output, q, ruby, s, samp, small, span,罢工，强，sub，sup，时间，tt，u，var
to allow all empty tags - try to add this to the config.js :
允许所有空标签 - 尝试将其添加到 config.js ：
for(var tag in CKEDITOR.dtd.$removeEmpty){
CKEDITOR.dtd.$removeEmpty[tag] = false;
}
回答by Tayyab Hussain
Have you tried this ?
你试过这个吗？
<script>
CKEDITOR.replace( 'text-area-id' );
CKEDITOR.config.allowedContent = true;
</script>
回答by Deva
Answer for CKEditor 4.
CKEditor 4 的答案。
Don't go for old version of CKEditor and this type of config.
不要使用旧版本的 CKEditor 和这种类型的配置。
Just add config.allowedContent = true;in your configuration.
It will allows all tags.
只需添加 config.allowedContent = true;您的配置。它将允许所有标签。
