在javascript dom元素創建上綁定ready事件

Question

我想知道在加載dom時是否可以在腳本創建的項目上綁定已加載或就緒事件。 我從live（）聽到但它不是可點擊的東西，它只是一個必須加載的項目。

謝謝你的幫助！

Answer 1

我想你最好的鏡頭是那里的load事件。

$('element').load(function(){
   alert('loaded');
});

本地人

var elem = document.getElementById('element_id');
elem.onload = function(){
   alert('loaded');
};

動態創建的另一個例子：

$('<img/>', {
   src:   '/images/myimage.png',
   load:  function(){
     alert('image loaded');
   }
}).appendTo(document.body);

Answer 2

您可以使用的授權形式.on()事件，如記錄在這里 ：

委托事件的優點是，它們可以處理來自稍后添加到文檔的后代元素的事件。 通過選擇在附加委托事件處理程序時保證存在的元素，您可以使用委派事件來避免頻繁附加和刪除事件處理程序。 此元素可以在一個模型-視圖-控制器設計視圖的容器元素，例如，或者document ，如果事件處理程序要監視文檔中的所有冒泡事件。 在加載任何其他HTML之前， document元素在文檔的頭部可用，因此可以安全地將事件附加到那里而無需等待文檔准備就緒。

Answer 3

如果您希望能夠分離用於創建項目和加載事件處理的代碼片段，您可以嘗試讓動態創建的元素在窗口上觸發自定義事件：

var myElement = $('<img/>', {
   src:   '/images/myimage.png'
}).appendTo(document.body);

$(window).trigger( {type: "myElementInit", myObject : myElement} );

通過在額外參數中返回自身的指針，您可以在jQuery（document）.ready中設置單獨的處理程序，以查找“myElementInit”窗口事件並從額外參數中獲取對元素的引用：

jQuery.('window').bind( "myElementInit", function(event){
  var theElement = event.myObject;
...
} );