Jquery工具提示为Child元素创建工具提示

Question

我有一个带有A标签的LI。

<li title="LI TEXT" id="test">
   ELEMENT WITH HREF <a href="#" title="HREF TEXT">HREF</a>
</li>

我想为LI创建jquery工具提示，并为其子元素创建默认工具提示。但这对于LI及其子节点的jquery元素都是如此。

$("#test").tooltip();

http://jsfiddle.net/k45emuhg/

Answer 1

好的，the items option您所描述的内容非常简单。只需为要显示其工具提示的项目添加选择器限制，例如与您在.tooltip()上调用的原始选择器相同：

$("#test").tooltip({items: "#test"});

这个问题没有明确说明，但是当你将鼠标悬停在children元素上时，你可能还想显示一个（而不是2个）工具提示。为此，您可以在mouseenter和mouseleave事件中禁用并重新启用父级的工具提示。 JQuery为the hover function提供了一个很好的快捷方式：

$("#test a").hover(function() {
    $(this).parent().tooltip("disable");
}, function() {
    $(this).parent().tooltip("enable");
});

请注意，您可以使用任何相关的选择器，不一定是$(this).parent()，具体取决于HTML的结构

以下是更新的示例小提琴：http://jsfiddle.net/957r8x51/