如何使用jQuery将表格显示为工具提示？

Question

我有一个用数据填充的Gridview，其中一列包含一个链接按钮(文件列表)。如果我单击Linkbutton (FileList)，就会触发一个.net事件，并调用数据库来检索数据。

如何将数据以HTML表格格式显示为工具提示，如所附图片所示？我想使用jQuery来实现工具提示。

​

​

Answer 1

简单的例子：

HTML

<a href="">test</a>
<table>
    <tr><td>asdf</td><td>gsdi</td></tr>
    <tr><td>asdf</td><td>gsdi</td></tr>
</table>

JS

$('a').hover(function(ev){
    $('table').stop(true,true).fadeIn(); 
},function(ev){
    $('table').stop(true,true).fadeOut();
}).mousemove(function(ev){
    $('table').css({left:ev.layerX+10,top:ev.layerY+10});
});

CSS

table{
    display:none;
    position:absolute;
}
td{
    border:1px solid red;   
}

Fiddle demo

Answer 2

安迪上面的响应应该有效，但"layerX“和"layerY”(已弃用)应替换为"clientX“和"clientY”。

或者我的火狐，Chrome和Safari，"clientX“100%有效，但当使用"layerX”时，工具提示在评论文本的顶部闪烁。