JQuery工具提示选择嵌套Div显示问题

我有一个约30-50行的信息列表，每个需要他们自己独特的工具提示。我知道我可以制作这些所有唯一的ID，但这会浪费很多JavaScript。我试图让jquery返回嵌套的<DIV>与“show_tooltip”类的任何<DIV>与类“tool_tip”的工具提示。所有的工具提示都是独一无二的。JQuery工具提示选择嵌套Div显示问题

<DIV class="tool_tip"> 
<DIV>Content here</DIV> 
<DIV style="display:none;" class="show_tooltip">Any tool tip information goes here with possible html</DIV> 
</DIV> 

<DIV class="tool_tip"> 
<DIV>Content here</DIV> 
<DIV style="display:none;" class="show_tooltip">Another but different tool tip to be displayed</DIV> 
</DIV>

我曾尝试下面的脚本，但它总是与一类的“show_tooltip”找到返回第一个<DIV>和重复，每行。以下是我已经尝试了剧本：

$(".tool_tip").tooltip({ 
bodyHandler: function() { 
    return $("div.tool_tip").children(".show_tooltip").html(); 
}, 
showURL: false 
});

我使用下面的工具提示插件：http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/

编辑：

感谢下面的答案。我认为工作产生的代码是：

$(".tool_tip").tooltip({ 
bodyHandler: function() { 
    return $(this).find('.tooltip_content').stop().html(); 
}, 
showURL: false 
});

来源

2010-12-10 bobcat

这是，或者应该是比较容易的：

$('.tool_tip').hover(
    function(){ 
     $(this).find('.show_tooltip').stop().fadeIn(500); 
    }, 
    function(){ 
     $(this).find('.show_tooltip').stop().fadeOut(500); 
    });

JS Fiddle demo。

上面的jQuery（和链接的演示）使用：hover()，stop()，fadeIn()和fadeOut()（只是为了参考的目的）。

来源

2010-12-10 18:21:22

谢谢我认为这将是简单的东西，我失踪了。对于JQuery和Javascript来说非常新颖。 – bobcat 2010-12-10 18:33:28

JQuery工具提示选择嵌套Div显示问题

回答

相关问题