通過jQuery .html（）添加的Html對javascript函數不可見

服務器上的每隔幾秒我生成一個html塊，我使用jQuery方法.html（）在UI中顯示該塊。通過jQuery .html（）添加的Html對javascript函數不可見

$('#contentContainer').html(JSON.parse(htmlString));

被注入的html被正確顯示。

但是，也有一些JavaScript函數，它操縱這個HTML代碼。例如，一個被連接到div元素：

$("#startStop").click(function() { ..});

另一個自舉工具提示：

$(function() { 
     $("[rel='tooltip']").tooltip(); 
     $(".errorTip").tooltip(); 
    });

的問題是，它們當我填充div元素與來自的HTML不再工作服務器。

我可以看到，元素與正確的ID創建：

<div id="startStop" data-toggle="button" class="sbClickable btn active"> 
    .... 
    </div>

唯一的區別是，當我在Chrome中打開源代碼，生成的HTML缺少那裏。

下面是步驟，我怎麼代碼加載到頁面：

page.chtml文件加載
有一個空div
```
<div id="contentContainer"> 
</div> 
```
然後在page.chtml中調用一個方法來填充容器。該方法位於外部js文件
```
<script type="text/javascript"> 
    einzelaktion.populateHtml(); 
</script> 
```
在populateHtml
我進行AJAX請求到服務器。當數據被檢索我空div和使用新的數據填充它：
```
$('#contentContainer div').empty(); 
$('#contentContainer').html(JSON.parse(htmlString)); 
```
方法，與我在同一外部js文件的問題。

我試着移動方法，它填充容器，page.chtml，但它沒有幫助。

我也嘗試創建容器元素，當頁面以直接的方式加載時，所以它們與page.chtml的其他元素一起創建，並且它們在頁面源中可見。在這種情況下，一切工作正常，直到我第一次調用服務器並替換div的html。

我GOOGLE了類似的問題，但沒有發現任何接近我的問題..

難道我錯過了什麼？

來源

2013-03-20 Anelook

變化

$("#startStop").click(function() { ..});

到

$("#contentContainer").on('click', '#startStop', function() { ..});

這樣，ID爲startStop，並調用綁定功能將接收click事件後所創建的元素。

來源

2013-03-20 11:18:16

您可能要替換「 #startStop'與類選擇器，如'.sbClickable.btn.active'。 'id元素startStop'聽起來不對，因爲一個id應該是唯一的。但是，Anelook只提到了一個具有正確ID的元素的例子，所以它應該沒問題。儘管如此，你可以改變你的小提琴。 – mayrs 2013-03-20 11:29:34

@junior我認爲#startStop元素沒有重複，因爲整個#contentContainer內容被替換了。 – 2013-03-20 11:34:57

完美的作品！對於工具提示 - 我每次更新容器時都會調用函數tooltip（）。非常感謝您的幫助！ – Anelook 2013-03-20 11:52:22

無論何時添加HTML到DOM它已經加載之後，你必須使用jQuery的關於（）函數來創建一個綁定...

例如， $(".newDiv").on('click', function() { alert('clicked dynamic HTML!')});

來源

2013-03-20 11:19:16 dockeryZ

通過jQuery .html（）添加的Html對javascript函數不可見

回答

相關問題