jQuery應用動作元素被注入

Question

我有一些元素的頁面被加載後，庫被注入。這些元素具有由jQuery控制的onClick操作。由於這些項目是在頁面加載後呈現的，jQuery是否會針對這些項目定位問題以應用onClick操作？

Answer 1

使用形式：

$("#myid").on("click",".myTargetElement", function(){ 
// do my click stuff here 
}); 

樣品標記：

<div id="myid"> 
    <div class="myTargetElement">Click Me</div> 
    <div class="myTargetElement">Click Me</div> 
</div> 

注：此表結合文檔不父元素，迫使文檔遍歷，因此不是最佳建議：

$(".myTargetElement").on("click", function(){ 
// do my click stuff here 
}); 

Exa mple：克隆在上面的標記中的第一個元素，並讓他們點擊藍色時：

$("#myid").on("click",".myTargetElement", function(){ 
    $(this).css('color','blue'); 
}); 

$('.myTargetElement').eq(0).clone().text("New").appendTo('#myid'); 

Answer 2

這是一個典型的使用委託事件的情況，您將處理程序綁定到父元素並將特定的選擇器作爲參數傳遞，只有在匹配選擇器是觸發事件的選擇器時，jQuery纔會觸發處理程序。

下直接瞭解更多關於jQuery的文檔和委託事件 - >http://api.jquery.com/on/

.on(events [, selector] [, data], handler(eventObject)) 

events - 一個或多個空格分隔的事件類型和可選 命名空間，如「點擊」或者「 keydown.myPlugin」。

selector一個選擇器字符串，用於過濾觸發事件的所選元素的後代。如果選擇器爲空或省略，則在事件到達選定元素時始終觸發事件 。

data觸發事件爲 時要傳遞給event.data中的處理程序的數據。

handler(eventObject)觸發事件爲 時執行的函數。值false也可以作爲簡單返回false的 函數的簡寫。

以上是針對可以稍後添加到DOM的動態元素。

注：委派事件

1. 櫃面，你應該總是把它綁定到最接近的靜態容器時綁定的處理器，這將是可用的。更多信息：Should all jquery events be bound to $(document)?

2. 但是，直接綁定元素插入到DOM後綁定處理程序可以實現的元素總是更好。