Question

我有一个垂直＆＃34;精确搜索＆＃34;结果栏位于页面的左侧。因为这个菜单可能很长，我想要一个＆＃34;更新结果＆＃34;在该菜单上的某个位置进行选择后，按钮显示在左侧，以便用户可以在完成更改后快速按下按钮。除非您从下拉菜单中进行选择，否则一切都很有效。出于某种原因，在从下拉菜单中进行选择后，按钮始终会返回到页面顶部。它只对下拉菜单执行此操作。

我正在使用以下jquery代码：

$(".topLeftNavBarInner").click(function(e){
        var parentOffset = $(this).offset(); 
        var relX = parentOffset.left-140;
        var relY = e.pageY-15;
        $(".FloatingUpdateSearchResultsDiv").show();
        $(".FloatingUpdateSearchResultsDiv").css({position:"absolute",left:relX,top:relY});
});

你可以在这里测试一下，看看我在说什么。点击＆＃34;放大类型＆＃34;关于＆＃34;优化搜索＆＃34;页面左侧的菜单： http://www.scopemonster.com/search777.php?Cat=91

Answer 1

问题可能是由于$（this）.offset（）的计算是基于“option”元素的位置，而不是我猜你想要定位的父“select”。

~~考虑这种方法：~~

var parentOffset;
if($(this).is('option'))
    parentOffset = $(this).parent().offset();
else
    parentOffset = $(this).offset();

<强>更新：

$(".topLeftNavBarInner").click(function(e){
    var parentOffset = $(this).offset();
    var relX = parentOffset.left-140;
    var relY;
    if(e.target.nodeName=='OPTION') {
        var selectOffset = $(e.target).parent().offset();
        relY = selectOffset.top;
    }
    else
        relY = e.pageY-15;
    $(".FloatingUpdateSearchResultsDiv").show();
    $(".FloatingUpdateSearchResultsDiv").css({position:"absolute",left:relX,top:relY});
});

如果OPTION是点击源，你仍然可以选择操纵“relY”值，但这应该将浮动DIV保持在你想要的区域。

X Y在下拉菜单中选择项目后定位

1 个答案: