Question

我尝试新的CKEditor 4，因为版本3.6中的代码更正不能接受这样的HTML 5有效代码：

<a href="#"><p>something</p></a>

但新的CKEditor版本仍然会修复此代码，那么问题出在哪里？是否需要在配置中将HTML 5设置为默认值？

Answer 1

不。 CKEditor解析器正在使用静态DTD。 HTML5无法用静态DTD描述，所以目前CKEditor不支持这种标记。

请参阅the ticket了解详情。

Answer 2

对于未来有同样问题的人来说，我确实提出了一个解决方案，但我并不过分乐观，因为它应该有一个选择，因为它完美在 HTML5

中有效

在config.js文件中，添加以下配置设置：

config.protectedSource.push(/[\r|\n]|(<a([^*>]+>)|<\/a>)/g);

以下是正则表达式的演示： DEMO

基本上我们在这里所做的就是：

查找新行\r
查找新行\n
找到任何空缺主题：<a后跟文字，然后我们来到> - (<a([^*>]+>)
查找关闭锚标记<\/a>

这个正则表达式将停止对找到的结果进行评估，我确定有更好的方法来做到这一点，因为我不是regexPERT（＆lt; - 擅长双关语！）

这应禁用用于在wysiwyg模式下编辑锚点的UI。这个修复对我有用，因为我添加它的编辑器在源模式下是固定的，所以这对于此目的是好的。

config.allowedContent = true;
config.fullPage = false;

希望这有帮助

Answer 3

有一种可行的方法可以使用xsl将任何未知元素映射到div或span-tag，使用原始元素作为classname，然后反转此onsubmit。我们一直这样做，然后回到xml，它运行得很好。

Answer 4

在config.js文件中，添加以下配置设置：

// Display all children elements allowed in a <a> element.
console.log(CKEDITOR.dtd[ 'a' ]);

// Simply redefine DTD like this:
CKEDITOR.dtd['a']['div'] = 1;
CKEDITOR.dtd['a']['p'] = 1;
CKEDITOR.dtd['a']['i'] = 1;
CKEDITOR.dtd['a']['span'] = 1;

// Check if <div> can be contained in a <p> element.
console.log( !!CKEDITOR.dtd[ 'a' ][ 'div' ] ); // default false

// Check if <a> can be contained in a <div> element.
console.log( !!CKEDITOR.dtd[ 'div' ][ 'a' ] ); // default true

对于Drupal 8，您可以将此代码添加到您的管理主题js中，而不是最佳解决方案但功能

CKEditor 4是否真的为HTML5做好了准备

4 个答案: