我有一个包含一些客户数据的表。我使用 jquery 悬停来向客户显示操作(编辑、删除、查看)
。
下面是html:
<table id="hovertable" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td>
Row 1 Column 1
</td>
<td>
Row 1 Column 2
</td>
<td>
<input type="hidden" name="iVal" value="1" />
Row 1 Column 3
</td>
</tr>
<tr>
<td>
Row 2 Column 1
</td>
<td>
Row 2 Column 2
</td>
<td>
<input type="hidden" name="iVal" value="2" />
Row 2 Column 3
</td>
</tr>
<tr>
<td>
Row 3 Column 1
</td>
<td>
Row 3 Column 2
</td>
<td>
<input type="hidden" name="iVal" value="3" />
Row 3 Column 3
</td>
</tr>
</table>
<div id="hovermenu" style="display: none; position: absolute;">
<a href="Home/Edit/" id="hoverlink">Edit</a>
</div>
脚本在这里:
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$("#hovertable tr").hover(
function() {
var pTop = $(this).offset().top;
var pLeft = $(this).offset().left + $(this).width() - "10";
$('#hoverlink').attr("href", "/Home/Edit/" + $(this).find('input[name=iVal]').val());
$("#hovermenu").css({
top: pTop,
left: pLeft
}).show();
},
function() {
$("#hovermenu").hide();
});
});
</script>
当我将鼠标移动到表格的每一行时,我可以显示客户行的操作。但是当我将鼠标移到操作(编辑、删除、查看)
上时,它会隐藏悬停菜单。
有什么办法可以解决吗?
最佳答案
将其添加到您的 JavaScript 中:
$("#hovermenu").hover(
function(){
$(this).show();
},
function(){}
);
它应该在鼠标悬停时保持菜单显示。
关于jquery - 在 jquery 中保持鼠标悬停菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1859966/