首页 文章

如何防止CKEditor将 Headers 设置为iframe？

提问于
浏览 次
5

我使用CKEditor以及jQuery UI的工具提示插件 . 会发生什么是CKEditor将title属性设置为其iframe元素，jQuery工具提示插件将其转换为工具提示然后，只要您将鼠标悬停在编辑器的任何部分上（每次编辑文本时都必须这样做） ，工具提示总是显示，说“富文本编辑器，elementId” .

即使我将工具提示插件的选择器设置为“*：not（iframe）”，它仍然会这样做 . 到目前为止，我发现没有为iframe设置工具提示的唯一方法是从选择器中排除“div”，但是我也丢失了编辑器的粗体/斜体等选项的工具提示 .

我无法在CKEditor的Javascript中找到设置iframe Headers 的代码部分，因此我可以将其删除 . 我找到的一个部分是语言文件中的实际 Headers 字符串，我可以用空字符串替换“富文本编辑器”，但它仍然将iframe的 Headers 设置为“，” .

任何帮助表示赞赏，我很乐意保留两个插件 .

jquery attributes ckeditor tooltip title

5 回答

  • 8

    陷入完全相同的问题，为另一个不太可能很快需要屏幕阅读器的开发人员开发自定义CMS .

    谢谢你的指针mihaisimi . 通过深入研究CKEditor实例属性，我最终编写了下面的JS位来从内容区域中删除"Rich text editor, element_id" Headers .

    CKEDITOR.on("instanceReady", function(e) {
 var $frame = $(e.editor.container.$).find(".cke_wysiwyg_div");
 if($frame) $frame.attr("title", "");
});

    所以基本上只要CKEditor在jQuery对象中加载I 'm wrapping the CKEditor' s容器，我就会用.find()查找实际内容 div 并用.attr()删除它的 Headers .

    请注意这个解决方案需要jQuery . 我'm using CKEditor version 4.1.1 in ' div模式'. Anyone using a similar version in ' iframe模式'可能会因为将 .find(".cke_wysiwyg_div") 更改为 .find(".cke_wysiwyg_frame") 而侥幸成功 .

    例如，您可以将一些代码附加到ckeditor / config.js文件中 . 它不漂亮，但它的工作原理 .

    希望我的解决方案可以帮助任何人解决这个问题 .

    回复于
  • 1

    您可以通过配置选项消除编辑器区域的 Headers （这将成为工具提示）：

    config.title = false;

    见http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-title

    回复于
  • 0

    您可以使用简单的javascript轻松设置它 . 你有一个样本如下 . 在我的情况下，ck 4.0.1内联用于所有id为“webedit”的页面div，工具提示将替换为我在comment属性中存储的文本 .

    div看起来像这样：

    <div id="webedit1" comment="My own tooltip">

    在实例上创建我的代码重置 Headers 并用我的评论替换它：

    CKEDITOR.on( 'instanceReady', function( event ) {
        var editor = event.editor;
        var divElement = event.editor.element.$;

        if(divElement){
            var divComment = divElement.getAttribute("comment");
            if(divComment){
                divElement.title=divComment;
            }
        }
    });

    美好的一天，Mihai

    回复于
  • 2

    您可以在工具提示选项中定义：

    $( document ).tooltip({
    items: "input[title],p[title],span[title],td[title],img[title],a[title]",
});

    对于您想要预期的iFrame的所有标签！

    回复于
  • 1

    This is where the title is being set.正如您所看到的，编辑器无法更改它，因为这对于屏幕阅读器和一般的a11y来说是一个至关重要的事情 . 但是，您可以更改wysiwygarea插件的代码以使其有所不同 .

    回复于

相关问题