Question

我想动态更改弹出窗口位置（左/右，上/下），具体取决于元素在屏幕上的位置。

//get_popover_placement(dom_el) returns 'left', 'right', 'top', or 'bottom'
    function set_popover(dom_el) {
    var the_placement = get_popover_placement(dom_el);
    $(dom_el).popover({
        offset: 10,
        placement: the_placement
    }).popover('show');
}

//set the placement on every hover
$('a[data-rel=popover]').hover(function(){
        set_popover(this);
    }, function(){});

它第一次工作，但是如果元素的位置发生变化（例如，当调整窗口大小时），则不会随后调用set_popover更新放置位置。

我在get_popover_placement中添加了一些代码，为元素添加了不同的颜色边框，具体取决于放置位置。边框颜色每次都会更新，表示正在调用代码并且计算正在正确完成，但展示位置不会更新。

看起来好像只能设置一次展示位置选项。我怎样才能解决这个限制？是否有某个变量可以被清除以重置弹出窗口？

Answer 1

~~尝试此更改，使用jQuery中的.on（）函数附加事件侦听器：~~

通过更新Kevin Ansfield的添加代码来更改此回复。

    $('a[data-rel=popover]').popover({
      placement: get_popover_placement
    });

    function get_popover_placement(pop, dom_el) {
      var width = window.innerWidth;
      if (width<500) return 'bottom';
      var left_pos = $(dom_el).offset().left;
      if (width - left_pos > 400) return 'right';
      return 'left';
    }

Answer 2

我刚刚再次检查了bootstrap源，并意识到传递给placement属性的函数会传递参数。我设法实现了与您尝试的类似的东西，尝试以下内容并查看它是否适合您：

$('a[data-rel=popover]').popover({
  offset: 10,
  placement: get_popover_placement
});

function get_popover_placement(pop, dom_el) {
  // your placement function code here
}

根据显示的位置动态更改弹出窗口的位置

2 个答案: