Bootstrap未按預期設置彈出模板

Question

我正在嘗試自定義用於引導彈窗的模板。我發現這...

$('.item').popover({ 
    html : true, 
    placement: 'left', 
    content: function(){ 
     return $(this).next('.our-popup').html(); 
    }, 
    template: '<div class="popover"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>' 
}) 

這很好用！但現在我想使模板動態的，所以我更改爲以下

template: $(this).next('.our-popup').next('.our-template').html(); 

我得到一個錯誤。

Uncaught TypeError: Cannot read property 'offsetWidth' of undefined 

我也試過這個...

template: function(){ 
    return $(this).next('.our-popup').next('.our-template').html(); 
} 

我得到...

Uncaught HierarchyRequestError: Failed to execute 'appendChild' on 'Node': Nodes of type '#document' may not be inserted inside nodes of type '#document-fragment'. 

Answer 1

我似乎已經找到了類似的回答here不完全一樣的，所以沒有標記作爲重複。另外我還爲他人編了一個jsfiddle

$(document).ready(function() { 
    $('#popover').popover({ 
    html: true, 
    title: function() { 
     return $("#popover-head").html(); 
    }, 
    content: function() { 
     return $("#popover-content").html(); 
    } 
    }); 
});