Bootstrap彈出窗口顯示遠程鏈接內容

Question

我想在某些元素上使用bootstrap彈出窗口。當鼠標懸停在該元素上時，遠程URL內容將顯示在彈出框中。

我發現這個建議的解決方案，如果你想使用AJAX： https://groups.google.com/forum/#!topic/twitter-bootstrap-stackoverflow/8MtpL1vEUOU

但我認爲有可能是一個更簡單的方法。

有什麼建議嗎？

Answer 1

使用此代碼：

<a href="/" class="btn btn-default btn-pop-over-element" data-container="body" data-toggle="popover" data-placement="top"> 
    Popover on top 
</a> 

<script> 

$('.btn-pop-over-element').click(function (e) { 
    e.preventDefault(); 
    $.ajax({ 
     url: $(this).attr('href'), 
     success: function() { 
      $('.btn-pop-over-element').popover({content: '<p>This is a test content</p>', title: 'Test Title', html :true}).popover('show');  
     } 
    }) 
}); 
</script> 

您也可以根據您的響應從Ajax調用收到更改標題和內容。您也可以根據需要更改href網址。