jQuery offset() 没有按预期工作

Question

我是 stackoverflow 的新手，请原谅我关于代码格式的问题。 我的问题是我已经创建了一个自定义的右键单击菜单，它将显示在“tr”上。所有“tr”都是动态生成的，每次右键单击 ul 都与每个 tr 相关联以实现不同的功能。 offset() 有问题，每当我右键单击任何 tr 时，我得到的菜单位置仅相对于第一个 tr。但是右键单击菜单与我之前所说的不同。请帮忙。

$('.cuz-menu').bind("contextmenu", function (e) {
    e.preventDefault();
    var posX = $(this).offset().left, posY = $(this).offset().top;
    $(this).find('.right-click').css({ "top": e.pageY - posY + "px", "left": e.pageX - posX -        85 + "px" }).show(0);
    

<tr class='right-content cuz-menu'>
         <td class="status ends-margin">
               <ul id=\"right-click\" class=\"right-click\">
                  <li>Diagram</li>
                  <li>Terminate</li>
                  <li>View Log</li>
               </ul>    
    <td class='rootProcess templates end-date'></td>
</tr>

Answer 1

问题似乎出在您对新的顶部和左侧值的计算上； pageY之间的区别和 offset().top对于每个 <tr>元素将是相同的。

假设您有四个 <tr>元素，每个高度为 50 像素。第一行的顶部偏移量为 400 像素，您右键单击它的中间位置。 pageY将为 425，顶部偏移量将为 400，因此新的顶部值为 25。

现在您将光标向下移动屏幕 100 像素，因此您位于第三行的中间位置。您右键单击该行。 pageY现在是 525，顶部偏移量现在是 500，但新的顶部值仍然是 25。