jQuery qTip：如何将单个工具提示div附加到多个目标div？

jQuery qTip插件的正常行为是为每个分配的工具提示项创建一个新的隐藏div。 有没有办法将单个隐藏的工具提示元素绑定到多个目标，以避免混乱DOM？

受挫的例子：

 
  $("#foo1,#foo2").qTip({"content":"test"});   
test
 
test 

如果qTip无法做到这一点，任何人都可以推荐另一个基于jQuery的工具提示插件，它只使用一个工具提示容器支持丰富的HTML？ 谢谢！

Answer 1

您可以动态构建qTip框。

HTML：

 Show a qTip 
 

使用Javascript：

 $('#some-link').click(function() { $('#hidden-element').qtip({ content: { text: '
Insert content here
', prerender: true //as of beta3, this option is false by default }, // etc, etc }); qtip = jQuery('#hidden-element').qtip('api'); qtip.show(); return false; }); 

有关qTip API的详细信息，请参阅http://craigsworks.com/projects/qtip/docs/api

编辑：2011年6月22日（justgrumpy） – 从beta3开始，qtip默认情况下不会预呈现 。 内容选项中的’prerender’必须设置为’true’才能动态显示qtip。

Answer 2

我是jQuery Tools Tooltip的粉丝。 它允许您在HTML中定义自己的工具提示结构，并且可以将该工具提示应用于您想要的任意数量的元素。

Answer 3

而不是使用逗号分隔的元素列表使用类选择器。 这是一个例子：

 $('.selectorClass').qTip({arguments:here}); 

我没有测试过这个，但它应该可以正常工作。

Answer 4

我已经想出如果有人发现它很方便，如何让一个工具提示div被许多工具提示图像共享

  $(".tooltipBearing").qtip({ content: { text: $("#tooltipDiv").html() } }); 

如果你没有把.html（）放在那里，你会看到共享工具提示出现一次，然后当你从另一个图像激活它时，它将不再适用于第一个…

tooltipBearing是页面中某些图像的类集。

tooltipDiv是包含工具提示内容的div的ID。