Question

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

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

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

任何帮助表示感谢，我很乐意保留两个插件。

Answer 1

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

感谢mihaisimi指针。通过深入研究CKEditor实例属性，我最终编写了下面的JS位来删除＆＃34; Rich文本编辑器，element_id＆＃34;来自内容区域的标题。

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

基本上，只要CKEditor加载我将CKEditor的容器包装在jQuery对象中，我就会用.find()查找实际内容div并删除其标题与.attr()。

请注意此解决方案需要jQuery。我在“div模式”中使用CKEditor版本4.1.1＆＃39;。在“iframe模式”中使用类似版本的任何人将.find(".cke_wysiwyg_div")更改为.find(".cke_wysiwyg_frame")可能会有所作为。

例如，您可以将一些代码附加到ckeditor / config.js文件中。它不漂亮，但它有效。

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

Answer 2

您可以通过配置选项删除编辑区域的标题（它成为工具提示）：

SparkContext

请参阅http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-title

Answer 3

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

div看起来像这样：

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

在实例创建时，我的代码会重置标题并将其替换为我的评论：

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;
            }
        }
    });

祝你有愉快的一天，米哈伊

Answer 4

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

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

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

Answer 5

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

如何防止CKEditor将标题设置为iframe？

5 个答案: