Twitter Bootstrap動態內容彈出對話

我想讓Bootstrap彈出對動態內容進行操作。我有一個返回一些數據行的jQuery AJAX請求。 AJAX成功函數將循環並從檢索到的數據中生成HTML代碼。生成的HTML具有Bootstrap代碼，但它不起作用。如果我只是正常寫HTML代碼，它可以正常工作。Twitter Bootstrap動態內容彈出對話

這是我想要做的一個例子。 newRowReg只是遍歷每個檢索到的記錄並將其附加到HTML字符串。

newRowReg += "<tr>"; 
newRowReg += "<td>" + xStatus + "</td>"; 
newRowReg += "<td><img src='green dotx.jpg' class='ppt1' data-container='body' data-toggle='popover' data-placement='right' data-content='Vivamus sagittis lacus vel augue laoreet rutrum faucibus.'>"; 
newRowReg += "</tr>"; 
$("#regTbl").append(newRowReg);

彈出窗口的Javascript代碼。

$('.ppt1').popover({ 
    title: 'Title 1', 
    trigger: 'hover', 
    content: 'Some Content!' 
    });

當它像這樣動態生成時，我該如何得到它的工作？

來源

2014-02-14 JimC

這可能已經在這裏討論然後前：http://stackoverflow.com/questions/12140491/bootstrap-popover -with-knockout-js。除了他正在使用事件處理程序。我會在ajax成功後再次調用popover函數。 – zer02

彈出窗口功能在AJAX之後調用。 – JimC

@ zer02 - 我通過您建議的鏈接進行了檢查。我是jQuery和Bootstrap的新手，所以我不知道如何將這些建議應用於我的情況。任何人都可以幫助我的案子？如何讓Popovers與加載頁面後附加的HTML一起使用？ – JimC

讓我們有這樣

<a href="#" id="show_media" class="btn btn-small btn-info" 
          rel="popover" 
          value="{{ $value->id }}" 
          data-content="<div id='div{{ $value->id }}'></div><script>loadMedia({{ $value->id }})</script>" 
          data-original-title="My Title">Show Media</a>

的鏈接車身結束

<script> 
    $(function(){ 
     $("#show_media").popover({placement: 'top', html: true}); 
    }); 
    function loadMedia(adsId){ 
     console.log("Ads ID: " +adsId); 
     $('div#div' + adsId).html('xxxx'); 
    } 
    </script>

來源

2014-07-15 16:33:54 Wen

Twitter Bootstrap動態內容彈出對話

回答

相關問題