维护鼠标悬停在jquery上的悬停菜单

Question

我有一个客户数据表。我正在使用jquery悬停来为客户显示actions(Edit, Delete, View)。

下面是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> 

当我移动鼠标在桌子上的每一行，我可以能够以示对行动顾客排。但是当我将鼠标移动到actions(Edit, Delete, View)上时，它隐藏了悬停菜单。

解决方法是什么？

Answer 1

添加到您的javascript：

$("#hovermenu").hover(
    function(){ 
    $(this).show(); 
    }, 
    function(){} 
); 

应该保持展示你的菜单，而它徘徊。