我在网站上使用CKEditor作为后端编辑器。尽管它似乎想在每次按下源按钮时都将代码更改为适合自己的样子，但仍使我转弯。例如，如果我点击源代码并创建一个<div>...

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

然后，它没有明显的原因将类从中剥离<div>，因此当我再次点击source时，它已更改为...

<div>some content</div>

我认为可以在中关闭这种令人讨厌的行为config.js，但是我一直在挖掘并且无法在文档中找到任何内容来将其关闭。

禁用内容过滤

最简单的解决方案是转到config.js并设置：

config.allowedContent = true;

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

配置内容过滤

您还可以更精确地配置CKEditor的内容过滤器，以仅允许您需要这些元素，类，样式和属性。这种解决方案要好得多，因为CKEditor仍会删除浏览器在复制和粘贴内容时生成的大量糟糕的HTML，但不会剥离所需的内容。

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

config.extraAllowedContent = 'div(*)';

或一些Bootstrap内容：

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

或者，您可以允许描述列表带有和元素的可选dir属性：dtdd

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

这些只是非常基本的例子。您可以编写所有类型的规则-要求属性，类或样式，仅匹配特殊元素，匹配所有元素。您也可以禁止添加任何内容并完全重新定义CKEditor的规则。进一步了解：

• CKEditor中的内容过滤 –为什么需要内容过滤器。
• 高级内容过滤器 –过滤机制的深入描述。
• 允许的内容规则 –如何编写允许的内容规则。

我找到了解决方案。

这将关闭筛选，它正在工作，但不是一个好主意...

config.allowedContent = true;

播放内容字符串适用于id等，但不适用于class和style属性，因为使用（）和{}可以进行class和style过滤。

所以我的选择是允许编辑器中的任何类是：

config.extraAllowedContent = '*(*)';

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

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

要仅对任何标记允许class =“ asdf1”和class =“ asdf2”：

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

（因此您必须指定类名）

仅对p标签仅允许class =“ asdf”：

config.extraAllowedContent = 'p(asdf)';

要允许任何标签的id属性：

config.extraAllowedContent = '*[id]';

等

要允许样式标签（<style type =“ text / css”> ... </ style>）：

config.extraAllowedContent = 'style';

稍微复杂一点：

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

希望这是一个更好的解决方案...

编辑：此答案适用于在drupal中使用ckeditor模块的用户。

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

这个答案是从这里复制的。所有学分应归原作者所有。

转到“管理>>配置>> CKEditor”；在个人资料下，选择您的个人资料（例如完整）。

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

不要忘记在“性能”标签下刷新缓存。

从CKEditor v4.1开始，您可以在CKEditor的config.js中执行此操作：

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

您可以参考官方文档，了解允许内容规则的详细语法

如果您使用的是ckeditor 4.x，则可以尝试

config.allowedContent = true;

如果您使用的是ckeditor 3.x，则可能出现此问题。

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

config.ignoreEmptyParagraph = false;

这在ckeditor中称为ACF（自动内容过滤器）。它会删除所有不必要的标记，即我们在文本内容中使用的标记。在config.js文件中使用此命令应关闭此ACK。

config.allowedContent = true;

请参考官方的高级内容过滤器指南和插件集成教程。

关于此强大功能，您会发现更多。另请参阅config.extraAllowedContent，它看起来很适合您的需求。

如果您将CKEditor库与Drupal AND模块一起使用，即“ WYSIWYG”模块，则可以采用以下解决方法。对我来说，它就像一种魅力。我在Drupal 7.33中使用CKEditor 4.4.5和WYSIWYG 2.2。我在这里找到了解决方法：https : //www.drupal.org/node/1956778。

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

<?php
/**
 * Implements hook_wysiwyg_editor_settings_alter().
 */
function MYMODULE_wysiwyg_editor_settings_alter(&$settings, $context) {
  if ($context['profile']->editor == 'ckeditor') {
    $settings['allowedContent'] = TRUE;
  }
}
?>

希望这对其他Drupal用户有所帮助。

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

的HTML

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

脚本

CKEDITOR.replace('post_content', {
   allowedContent:true,
});

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

详细信息：CK编辑器允许的内容规则

我发现切换为使用完整html而不是过滤的html（在“文本格式”下拉框中的编辑器下面）对我来说已解决了此问题。否则，样式将消失。

我想添加此config.allowedContent = true; 需要添加到ckeditor.config.js文件而不是config.js，config.js对我没有任何帮助，但将其添加到ckeditor.config.js的顶部区域保留了我的div类

如果使用drupal，则另一种选择是简单地添加要使用的css样式。这样，它不会删除样式或类名。

所以在我的情况下，在drupal 7的css标签下只需添加类似

facebook = span.icon-facebook2

还要检查是否启用了字体样式按钮

我在ckeditor 4.7.1的Chrome上遇到相同的问题。只需在ckeditor instanceReady上禁用pasteFilter。此属性将禁用高级内容过滤器（ACF）的所有过滤器选项。

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