时间戳

首页 > 解决方案 > 阻止 CKEditor 4 添加额外的 HTML 标签

html - 阻止 CKEditor 4 添加额外的 HTML 标签

问题描述

我在 CKEditor 4 添加额外的 HTML 标签时遇到问题。我已经使用 v3 几年了，没有任何问题，并且我已经构建了自己的插件，所以我不是一个完整的新手，但这让我很难过。例如下面的 HTML 块：

<section class="component2">
    <div class="">
        <div class="component2__row">
            <a class="component2__item component2__item--primary" href="#">
                <img class="component2__item__image" src="http://MyServer/webmedia/Images/Components/component2/image-1.jpg" alt="IMG"/>
                <h4 class="component2__item__title">Light Vehicle</h4>
            </a>
        </div>
    </div>
</section>

保存为：

<section class="component2">
    <div>
        <div class="component2__row">
            <a class="component2__item component2__item--primary" href="#">
                <img alt="IMG" class="component2__item__image" src="http://MyServer/webmedia/Images/Components/component2/image-1.jpg" />
            </a>
            <h4 class="component2__item__title">
                <a class="component2__item component2__item--primary" href="#">Light Vehicle</a>
            </h4>
            <a class="component2__item component2__item--primary" href="#"> </a>
        </div>
    </div>
</section>

有任何想法吗？（例如，注意附加的锚标记！） HTML 中是否有它不喜欢的东西？我可以使用 config.js 中的设置吗？

谢谢

标签： htmltagsckeditorconfigckeditor4

解决方案

如果其他人偶然发现了这个，我会解决它。因为它已经是我的默认设置（从 v3 开始），所以我已经尝试过：

config.allowedContent = true;

我详细阅读了文档，甚至尝试编辑 dtd 以允许标题位于 div 和锚点中：

CKEDITOR.dtd['div']['h'] = 1;
CKEDITOR.dtd['a']['h'] = 1;

一切都无济于事。最终我放弃了并用 a 替换了<h4>我的示例中的标签<span>并相应地对其进行了样式设置。这有效，CKEDITOR 现在让我的源 HTML 保持不变。令人恼火的是，没有一个功能可以让您告诉编辑器“看，我知道我的 HTML 是有效的，别管它，我会处理任何后果。”

推荐阅读