Question

我有这样的表（如下）。如果有人将鼠标光标放在此名称上，我想获取某人的详细信息。例如，如果有人将光标移到名称“John”上，则会向他显示“位置：美国，性别：男，城市：洛杉矶”。我怎么能用jQuery做到这一点？

<table cellspacing="0" cellpadding="2" border="1" width="100%" class="tariff_table">
<tbody>
<tr>
<td width="150" valign="top" class="title_td">
<strong>Name</strong></td>
<td valign="top" class="title_td">

<strong>Surname</strong><strong></strong>
<p></p></td>
<td valign="top" class="title_td">

<strong>Middle Name </strong></td>
</tr>
<tr>
<td valign="top">

John</td>
<td valign="top">

Locaste</td>
<td valign="top">

Sawqa</td>
</tr>
<tr>
<td valign="top">

Jafde</td>
<td valign="top">Saqzw</td>
<td valign="top">

Porda</td>
</tr>
</tbody></table>

Answer 1

可能你正在寻找这个。请参阅demo

http://pupunzi.open-lab.com/2009/02/07/mbtooltip/

Answer 2

这需要一些调整，但它基本上是你想要的。

http://jsfiddle.net/8yQGW/2/

您创建一个包含工具提示的固定元素。将鼠标悬停在行/单元格上即可显示它。鼠标移开时 - 隐藏它。非常直截了当。

现在它有点小马车，因为如果你鼠标悬停在工具提示上，它会导致隐藏代码触发。您可能希望将其从悬停切换到mousemove并让工具提示跟随光标。你没有指明，所以我不打算猜测你的意图。

$('td').hover( 
    function(e) { 
        console.log(e.clientX + ' : ' + e.clientY );
        $('.tooltip').html($(this).html()).css( { top: e.clientY + 15, left: e.clientX + 15 } ).fadeIn('fast'); ; 
    },     
    function(e) { $('.tooltip').fadeOut('fast'); } 
);

如何使用Jquery获取链接标题信息？

2 个答案: