jquery工具提示和动态内容的问题 - func_tooltip

时间:2014-03-01 05:13:51

标签: jquery

我正在使用可在触摸屏上工作的jquery工具提示......

http://osvaldas.info/elegant-css-and-jquery-tooltip-responsive-mobile-friendly

它涉及调用func_tooltip()。当有一些初始工具提示时会发生问题....调用func_tooltip()并且它们有效。然后,如果有新的动态内容,则需要再次调用func_tooltip(),然后新的工具提示才有效。但是如果func_tooltip()被调用两次,原始工具提示只会再次使用一次,那么它们就会停止工作。

请参阅:

http://jsfiddle.net/vg83V/1/

部分代码:

$(function(){
    func_tooltip();
    $("#show_new_content").click(function(){
        $('#dynamic_div').html('<span title="New tooltip message" rel="tooltip">?</span>');
        func_tooltip();
    });
});

1 个答案:

答案 0 :(得分:1)

您使用的特定工具提示库缺乏对动态工具提示的支持。

当你第二次调用func_tooltip(或任何后续调用)时,所有包含rel =“tooltip”的元素都已被处理,并且会删除它们的title属性。

这需要完成,因此浏览器的原生工具提示支持不会显示工具提示本身。

要使该库无法清除以前的工具提示,需要存储原始标题属性并从那里重新加载。

然而,还有其他问题需要处理宽度,例如,当再次调用func_tooltip时,每次都会向同一工具提示添加事件绑定。处理所有工具提示的中央事件处理程序可以解决该问题。

该工具提示库的另一个问题是它没有转义title属性中的任何内容,这会打开安全漏洞。

因此,图书馆需要一些相当大的更新。

我已经使用了jquery-ui的工具提示http://www.jqueryui.com/tooltip/,我可以通过在我需要的地方注入新的工具提示来添加新的工具提示。 jquery-ui工具提示可以跟踪鼠标移动,并相应地调整自身,因此定位正在处理以及我提到的其他问题。

IMO,你可以更快地查看jquery-ui工具提示或类似内容,而不是尝试修复刚刚使用的库。