Question

我正在使用the tipsy jquery plugin为动态显示的元素创建工具提示。

工具提示适用于非动态元素，所以我肯定包含了我需要的所有内容。我正在使用jquery 1.5.1

这是我的jquery代码：$('.voted-user-image').tipsy({gravity:'s', live: true});

这是一个图像链接元素的html，它在单击一个触发AJAX请求的链接后在div中动态显示：

<a href="/profiles/2" class="voted-user-image" title="Test">
    <img alt="Justin meltzer" src="/system/photos/2/tiny/Justin Meltzer.jpeg?1306836552">
</a>`

如何让这个工具提示插件正常工作？

Answer 1

你可以尝试这段代码：

$('a.voted-user-image').tipsy({live: true});

每次添加内容时，看起来错误调用插件：）

Answer 2

function initTipsy(){
    $(function(){ $('.tips').tipsy({gravity: 's',html: true}); });
    $(function(){ $('.tips-right').tipsy({gravity: 'w',html: true}); });
    $(function(){ $('.tips-left').tipsy({gravity: 'e',html: true}); });
    $(function(){ $('.tips-bottom').tipsy({gravity: 'n',html: true}); });
}

我有这个功能，我在我的main.js中调用，适用于我的整个项目。这允许我向任何静态元素添加提示。我对动态元素有同样的问题，我找到的解决方案是在将新元素附加到html后再次调用initTipsy。我知道这不是一个漂亮的解决方案，但它确实有效。希望能有所帮助。

Answer 3

不确定为什么Dolphin的回答得到了提升，甚至奖励了奖金。他建议使用jQuery tipsy的live选项，但这已经在原始海报（未经编辑）提供的代码中使用。显然，该选项似乎没有成功。

回答原帖：tipsy插件的live选项似乎不适用于所有版本的jQuery。版本1.7.1已经确认可以使用，因此升级jQuery可能是一个好主意。

Answer 4

我刚刚在AJAX请求呈现的div中的script标记中再次调用了该插件。这很有用。

用于动态直播活动的Tipsy jquery插件不起作用

5 个答案: