設置數據后，Bootstrap Popover箭頭將不會隨數據位置更改而更改

Question

目標：

我正在使用具有15分鍾分段的時鍾來創建調度UI，該時鍾可以被會議占用，也可以空着。 我的頁面上有一個時鍾圖像，當您單擊圓圈時，您單擊的切片的外部會出現一個引導彈出窗口（提供有關該時間以及是否有會議的說明）

---

問題：

根據您單擊時鍾的哪個象限（頂部，底部，左側，右側），我更改了彈出框的數據位置，因此箭頭將指向時鍾。 這是我第一次執行此操作，但是此后，每次我重新定位彈出框以進行新的單擊時，箭頭方向都保持不變。

---

碼：

JS：

    var direction = getArrowDirection(seg); //finds the direction the arrow should face
    var popover =  $('#generalPopover'); 
    popover.attr("data-placement", direction);
    $('[data-toggle="popover"]').popover();
    $(".meetingPopover").popover("show");

HTML：

<div data-toggle="popover" title="Meeting at Opus: 3:30pm to 5pm" 
data-content="Some content inside the popover" style="float: left;" 
class="meetingPopover" id="generalPopover">Popover</div>

---

題：

第一次設置箭頭后，為什么箭頭沒有改變方向？ 這不應該改變指示箭頭指向的數據位置嗎？

Answer 1

如果您像這樣抓取popover實例：

var popover = $('.reply').data('bs.popover');

然后，要重繪彈出窗口，請使用.setContent()方法：

popover.setContent();

我發現瀏覽源代碼： https : //github.com/twitter/bootstrap/blob/master/js/popover.js

因此，在您的示例中，請嘗試：

thisVal.attr('data-content',data).data('bs.popover').setContent();

更新資料

setContent()方法還刪除了放置類，因此您應該執行以下操作：

var popover = thisVal.attr('data-content',data).data('bs.popover');
popover.setContent();
popover.$tip.addClass(popover.options.placement);

演示： http ： //jsfiddle.net/44RvK