JqueryUI datepicker的定位：如何设置相对于自动显示位置的位置？

Question

我有一个带有过滤器框的搜索页面。在此框中有两个日期过滤器，Before和After。每个日期过滤器都使用jquery ui-datepicker。第一个看起来像这样：

第二个看起来像这样：

我需要将“日期前”框（图像2）的日历显示在与“日期后”框（图像1）相同的位置。我不认为我可以硬编码第二个日历的位置，因为虽然这可能在我的计算机上工作，但更宽或更小的屏幕可能会将它放在错误的位置。我也无法将其设置为相对值，因为其位置已使用绝对值设置。如何显示第二个日历，比如它会自动显示的左侧200px？

Answer 1

我使用atom.gregg的答案来提出解决方案：

$("#beforedate").datepicker({
    beforeShow: function(input, inst) {
        setTimeout(function () {
            var offsets = $("#afterdate").offset();
            var top = offsets.top + 25;
            inst.dpDiv.css({
                top: top,
                left: offsets.left,
            });
        });
    }
});

Answer 2

我最初认为你需要连接'onshow'事件，所以按照这个思路，我发现了这个问题：How to change jquery ui datepicker position?

在该帖子下面示例中显示的事件处理程序中，您可以正确设置位置，即。相对于另一个控制。

$("#datepicker").datepicker({
    beforeShow: function (input, inst) {
        setTimeout(function () {
            inst.dpDiv.css({
                top: 100,
                left: 200
            });
        }, 0);
    }
});