Class CKEditor自动从div中剥离类

我在我的网站上用作后端编辑器。尽管如此，它还是让我感到非常不安，因为每当我按下源代码按钮时，它似乎都想将代码更改为它认为合适的方式。例如，如果我点击源代码并创建一个

<div class="myclass">some content</div>

一些内容

然后，它没有明显的原因将该类从

中删除，因此当我再次点击源代码时，它已更改为

<div>some content</div>

一些内容

我认为这种恼人的行为可以在

config.js中关闭，但我一直在挖掘，在文档中找不到任何东西可以关闭它。
禁用内容过滤
最简单的解决方案是进入config.js并设置：

config.allowedContent = true;

（记住清除浏览器的缓存）。然后，CKEditor停止过滤输入的内容。但是，这将完全禁用最重要的CKEditor功能之一

配置内容筛选
您还可以更精确地配置，只允许您需要的这些元素、类、样式和属性。这个解决方案要好得多，因为CKEditor仍然会删除浏览器在复制和粘贴内容时产生的大量蹩脚的HTML，但它不会删除您想要的内容

例如，可以扩展默认CKEditor的配置以接受所有div类：

config.extraAllowedContent = 'div(*)';

或者一些引导程序的东西：

config.extraAllowedContent = 'div(col-md-*,container-fluid,row)';

或者，您可以为
dt
和
dd
元素允许具有可选
dir
属性的描述列表：

config.extraAllowedContent = 'dl; dt dd[dir]';

这些只是非常基本的例子。您可以编写所有类型的规则—需要属性、类或样式、仅匹配特殊元素、匹配所有元素。你也可以禁止这些东西，完全重新定义CKEditor的规则。
阅读更多关于：


–您为什么需要内容过滤器
–深入描述过滤机制
–如何编写允许的内容规则
如果您使用的是ckeditor 4.x，您可以试试

config.allowedContent = true;

如果您使用的是ckeditor 3.x，则可能会出现以下问题

尝试将以下行放入config.js中

config.ignoreEmptyParagraph = false;

请参阅及

关于这个强大的功能，您将发现比这多得多的东西。还可以看到它似乎适合您的需要。
由于CKEditor v4.1，您可以在CKEditor的config.js中执行此操作：

CKEDITOR.editorConfig = function( config ) {
  config.extraAllowedContent = '*[id](*)';  // remove '[id]', if you don't want IDs for HTML tags
}

您可以参考官方文档了解
我发现，切换到使用完整html而不是过滤html（在文本格式下拉框中的编辑器下方）是解决此问题的方法。否则样式将消失。
我想添加这个config.allowedContent=true；需要添加到ckeditor.config.js文件中，而不是config.js，config.js没有为我做任何事情，只是将它添加到ckeditor.config.js的顶部区域，保留了我的div类
编辑：这个答案适用于在drupal中使用ckeditor模块的人

我找到了一个不需要修改ckeditor js文件的解决方案

这个答案是抄袭自。所有学分应归原作者所有

进入“管理>>配置>>编辑”；在“配置文件”下，选择您的配置文件（例如完整）

编辑该配置文件，并在“高级选项>>自定义JavaScript配置”中添加
config.allowedContent=true


不要忘记刷新“性能选项卡”下的缓存

我找到了解决办法

这会关闭过滤，它会工作，但不是一个好主意

config.allowedContent = true;

使用内容字符串对id等很有效，但对类和样式属性无效，因为类和样式过滤有（）和{}

所以我打赌允许编辑器中的任何类都是：

config.extraAllowedContent = '*(*)';

这允许任何类和任何内联样式

config.extraAllowedContent = '*(*);*{*}';

对于任何标记，只允许class=“asdf1”和class=“asdf2”：

config.extraAllowedContent = '*(asdf1,asdf2)';

config.extraAllowedContent = '*[id]';

（因此必须指定类名）

仅允许p标记使用class=“asdf”：

config.extraAllowedContent = 'p(asdf)';

要允许任何标记的id属性，请执行以下操作：

config.extraAllowedContent = '*(asdf1,asdf2)';

config.extraAllowedContent = '*[id]';

等等

要允许样式标记（…），请执行以下操作：

更复杂一点：

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

希望这是一个更好的解决方案…
如果使用drupal，另一个选择就是添加您想要使用的css样式。这样就不会去掉样式或类名

因此，在我的例子中，在Drupal7的css选项卡下，只需添加如下内容

facebook=span.icon-facebook 2

还要检查字体样式按钮是否已启用
如果使用Drupal和CKEditor库中名为“WYSIWYG”的模块，则以下解决方法可能是一种解决方案。对我来说，它就像一个符咒。我在Drupal7.33中使用了CKEditor 4.4.5和WYSIWYG2.2。我在这里找到了此解决方法：

这是：
我创建了一个自定义模块，并将以下代码放入“.module”文件中：



我希望这对其他Drupal用户有所帮助。
这在ckeditor中称为ACF（自动内容过滤器）。它删除了我们在文本内容中使用的所有不必要的标记。在config.js文件中使用此命令应关闭此确认

config.allowedContent = true;

以下是CKEDITOR 4.x的完整示例：

HTML

<textarea name="post_content" id="post_content" class="form-control"></textarea>

上面的代码将允许编辑器中的所有标记

有关更多详细信息：
我在使用ckeditor 4.7.1的chrome上面临同样的问题。只需在ckeditor instanceReady上禁用pasteFilter。此属性禁用高级内容筛选器（ACF）的所有筛选器选项

我在深入挖掘之后找到了解决方案，如果您进入config.js并设置CKEDITOR.config.allowedContent=true；这样编辑器就不会乱来了。上面有一个语法错误。具体来说，样式属性必须用卷曲分支{}而不是parens（）来设置。Hi kamelkev，我的答案是针对类，而不是针对样式，正如问题所述。基本上，这就是我正在使用的，我不认为它有错误。谢谢你的回答，你的
*[id]（*）
成功了，我以前尝试过
*[id，class]
，但不知怎的，这不允许class属性。CKeditor文档是
CKEDITOR.replace('post_content', {
   allowedContent:true,
});

 CKEDITOR.on('instanceReady', function (ev) {
        ev.editor.pasteFilter.disabled = true;
    });