2

据我了解，CKEditor 会自动删除一个空锚。问题是很多 HTML 插件都使用空锚点，并在页面加载后将它们存储在 JavaScript 中。

例如，如果我喜欢使用 AddThis 他们让我添加下一个代码：

<div class="addthis_toolbox addthis_default_style ">
    <a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
    <a class="addthis_button_tweet"></a>
    <a class="addthis_button_pinterest_pinit"></a>
    <a class="addthis_counter addthis_pill_style"></a>
</div>

在我将显示从 Source 更改为 Design 之后，CKEditor 正在删除所有锚点。

我知道如果我将添加到锚点，CKEditor 不会删除它们，但在我的情况下我不能使用它。

我找到了删除文件中链接的行：/ckeditor/ckeditor_4.0.1_full_source/core/htmldataprocessor.js Lines: 536-540

他们正在添加一个删除任何空锚点的 htmlFilter 规则。现在，我知道我可以编辑 CKEditor 源文件并更改它，但我不喜欢这样做，因为任何时候我要升级一个版本，我都需要使用相同的修复程序，所以我喜欢使用 CKEditor API 修复它。

我找到了如何通过以下方式添加规则：

CKEDITOR.instances['instanceName'].dataProcessor.dataFilter.addRules(
            {
                elements :
                {
                    a : function( element )
                    {
                        //Do what i like to do
                    }
                }
            });

问题是，即使我为 A TAG 添加规则，它仍然不会覆盖 CKEditor 制定的规则。

有没有办法覆盖那里的规则或以另一种方式解决这个问题？

4

3 回答 3

0

尝试在标签上使用随机名称：

<div class="addthis_toolbox addthis_default_style ">
    <a class="addthis_button_facebook_like" fb:like:layout="button_count" name="at_r"></a>
    <a class="addthis_button_tweet" name="at_t"></a>
    <a class="addthis_button_pinterest_pinit" name="at_p"></a>
    <a class="addthis_counter addthis_pill_style" name="at_c"></a>
</div>
于 2014-01-07T06:20:20.060 回答
0

我想出了一个解决方案。您需要使用来自 shopify (gem liquid) 的液体代码解析器，而且它真的很容易做到。安装 gem 后，您可以执行以下操作：

<%= Liquid::Template.parse(your_ckeditor_content).render({
   code_you_want_untouched => %Q{ html code here }
}) %>

用该行替换您当前的 CKEditor 输出代码。

然后，您现在将“code_you_want_untouched”作为可在 CKEditor 中使用的变量。

您在 CKeditor 内容中这样称呼它：

{{ code_you_want_untouched }}

由于 html 代码不再来自 CKEditor，因此它不会剥离任何内容。关于液体的最酷的部分是您可以使用任意数量的变量，并且您可以在变量代码中执行 Ruby。

于 2013-12-29T15:35:29.277 回答
0

我有同样的问题，我让它停止删除空标签的唯一方法是将它添加到 config.js

config.protectedSource.push(/<a[^>]*><\/a>/g);
enterCKEDITOR.dtd.$removeEmpty.a = 0;

注意：然而，在我的 cke 中，背景图像不会出现在编辑器中。他们工作得很好，他们只是没有出现。我希望它只是一个可以修复的错误。

于 2017-01-14T00:29:56.800 回答