弹出窗口的动态定位

Question

我有一个来自数据库的动态填充表，其中有相当多的行数。我已经设置了一个JSFiddle在这里

在驱动程序行中，我有一个弹出，它将显示当前可用的驱动程序，通过单击它们，我可以为相应的预订分配一个驱动程序。

我希望直接在已单击的行下弹出驱动程序- div，因为它现在是在固定位置弹出的驱动程序div，我需要一种方法来动态更新div的位置以匹配单击的行。

我试过用.position();和.index();，但我无法使它工作。

Answer 1

使用.offset()

$('#select-driver-list').offset( elem.offset() );

这将将驱动程序框的顶部设置为链接(elem)的顶部。您可以使用它来将像素的高度添加到盒子的顶部，以使其显示出来。

if (elem.length) {
    e.preventDefault();
    var o = elem.offset();
    o.top += elem.height();
    $('#select-driver-list').toggle(100).offset( o );
}

Answer 2

只更新逻辑，

$(document).ready(function () {
    $(".select-driver").each(function(e){
        $(this).on("click",function(){
            $(this).parent("div").siblings("div").toggle();
        });
    });
});

工作良好：小提琴