如何防止ckeditor不添加空白HTML标记

Question

我已在Windows 8.1 OS中安装了Visual Studio 2012 Express，并根据要求在我的项目中使用了CKEditor。

我是CKEditor的新手，并且也以适当的方式使用它，但问题是在CKEditor中的源代码中定义了html，它会自动替换

<div><i class="classname"></i></div>

与

<div>&nbsp;</div> or <div></div>

那么，如何防止CKEditor不替换它并按原样保存呢？ 我有一些解决方案，但仍要替换一些错误

<i class="classname"></i>

与

<div class="classname"></div>

但会在标记之间自动添加＆nbsp。

如何防止不添加＆nbsp？

下图中的CKEditor已打开，您可以在圆形区域中看到它自动在我的代码中添加了一些空格或制表符。

如何停止呢？

Answer 1

看看这个帖子： CKEditor不需要的＆nbsp; 人物

经过一番研究后，我可能会对这个问题有所了解-不幸的是，没有现成的解决方案。

在CKEditor中，可以通过四种方式产生不间断空间 （有人知道吗？）：

1. 自动填充空块 。 可以在配置中禁用它：

    config.fillEmptyBlocks = false; 

2. 按TAB键自动插入 。 可以在配置中禁用：

    config.tabSpaces = 0; 

3. 将双精度空格转换为SPACE + NBSP。 这是浏览器的行为，因此不会由CKEditor团队修复 。 它可以是服务器端固定的，也可以是客户端javascript onunload固定的。 也许这个php是一个开始：

    preg_replace('/\\s \\s/i', ' ', $text); 

4. 通过复制和粘贴。 如果粘贴UTF-8不间断空格或双空格，则CKEditor会自动将其转换。 我在这里看到的唯一解决方案是如上所述进行正则表达式。 config.forcePasteAsPlainText = true; 没有帮助。

简介：为了摆脱所有不间断空格，您需要编写一个附加功能来清理用户输入。

评论和进一步的建议，不胜感激！ （我正在使用ckeditor 3.6.4）

编辑＃1

看看这个。

CKEDITOR.dtd.$removeEmpty.i= 0;

您也可以将其与span和其他标签一起使用。

此文档。

停止在CKEditor中删除任何空标签

有一个定义好的标签列表，如果标签为空，将被删除（请参阅dtd.js和$ removeEmpty或从控制台运行CKEDITOR.dtd。$ removeEmpty）。

• 从HTmL

为了确保不删除某些空标签，请添加属性“ data-cke-survive”：

 <span data-cke-survive="true" ></span> 

• 来自配置

或者，您可以配置特定标签，使其不被删除：

 if(window.CKEDITOR){ CKEDITOR.on('instanceCreated', function (ev) { CKEDITOR.dtd.$removeEmpty['span'] = 0; CKEDITOR.dtd.$removeEmpty['TAG-NAME'] = 0; } } 

通过在CKEDITOR.dtd。$ removeEmpty中将元素设置为0，可以防止CKEditor删除空标签。

http://margotskapacs.com/

Answer 2

该主题可能对https://stackoverflow.com/有帮助

简而言之，您可以在配置中禁用自动填充空白块：

config.fillEmptyBlocks = false;

更多信息- 在这里

UPD。

您可以尝试此config.protectedSource.push(/<i[^>]*><\\/i>/g);

从官方文件

{Array} CKEDITOR.config.protectedSource从：3.0

将在输入HTML上执行的正则表达式列表，指示匹配的HTML源代码在WYSIWYG模式下不可用于编辑。

config.protectedSource.push（/ <\\？[\\ s \\ S] *？\\？> / g）; // PHP代码

config.protectedSource.push（/ <％[\\ s \\ S] *？％> / g）; // ASP代码

config.protectedSource.push（/（] +> [\\ s | \\ S] *？</ asp：[^>] +>）|（] + />）/ gi）; // ASP.Net代码

UPD 2

希望这会有所帮助。

 CKEDITOR.on( 'instanceReady', function( ev ) { // turn off excess line breaks in html output formatting for blockquote tag. // In same way you can correct any tag output formating ev.editor.dataProcessor.writer.setRules( 'blockquote', { indent : false, breakBeforeOpen : false, breakAfterOpen : false, breakBeforeClose : false, breakAfterClose : true }); }); 

Answer 3

对于使用UniSharp / laravel-ckeditor的用户

<script>
  var options = {
    fillEmptyBlocks: false,
  };

  CKEDITOR.replace( 'content', options);
</script>