5

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

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

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

任何帮助表示赞赏，我很想保留这两个插件。

4

5 回答 5

9

Bumped into the exact same problem, developing a custom CMS for another developer who isn't likely to need a screen reader anytime soon.

Thanks mihaisimi for your pointer. With a bit of digging into CKEditor instance properties, I ended up writing the JS bit below to remove the "Rich text editor, element_id" title from the content area.

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

So basically as soon as the CKEditor loads I'm wrapping the CKEditor's container in a jQuery object, I look for the actual content div with .find() and remove its title with .attr().

Please note this solution requires jQuery. I'm using CKEditor version 4.1.1 in 'div mode'. Anyone using a similar version in 'iframe mode' would probably get away with changing .find(".cke_wysiwyg_div") to .find(".cke_wysiwyg_frame").

You could append the bit of code to the ckeditor/config.js file, for example. Its not pretty, but it works.

Hope my solution helps anyone bumping into this problem.

于 2013-05-02T16:57:30.320 回答
2

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

config.title = false;

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

于 2015-10-20T13:23:01.700 回答
1

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

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

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

于 2014-04-09T14:02:25.617 回答
1

您可以使用简单的 javascript 轻松进行设置。您在下面有一个示例。在我的情况下，ck 4.0.1 用于所有以“webedit”开头的 id 的页面 div，工具提示被我存储在评论属性中的文本替换。

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

祝你有美好的一天，米海

于 2013-03-07T11:57:54.007 回答
0

这是设置标题的地方。如您所见，编辑器无法更改它，因为这对于屏幕阅读器和一般 a11y 来说是至关重要的。但是，您可以更改所见即所得插件的代码以获得不同的东西。

于 2013-01-28T13:59:27.223 回答