JS：追加找不到ATTR

Question

$(".btn").click(function() 
{ 
    $(".content").append(
    "<div class='randomDiv' id='1'></div>" 
    ); 
} 

如果上面是「積極的」，那麼我不能：

$(".randomDiv").click(function() 
{ 
    alert($(this.attr("id"))); 
} 

我一派，並發現這是因爲我追加前JS被加載，但避風港」找到了一個解決方案如何在JS上加載後註冊。

Answer 1

或者：

附加的事件處理程序，當你創建元素

$(".btn").click(function() { 
    $("<div class='randomDiv' id='1'></div>") 
     .on("click", myFunction) 
     .appendTo(".content"); 
} 

function myFunction() { 
    alert($(this.attr("id"))); 
} 

...這樣的元素不存在，當你綁定的事件處理程序

使用委派處理

$(document).on("click", ".randomDiv", function() { 
    alert($(this.attr("id"))); 
}); 

...那個捕獲所有點擊事件，因爲它們會冒充文檔並檢查它們來自哪些元素。

Answer 2

如果您動態添加元素，那麼正常的點擊功能將不起作用。使用

$(document).on("click",".randomDiv",function(event){ 
     alert($(this).attr("id")); 
}); 

Answer 3

$(".content").on('click', '.randomDiv', function() 
{ 
    alert($(this.attr("id"))); 
} 

$（ 「內容」）可與randomDiv的任何現有父項目來替換。說的內容DIV是頁面左格，然後上面的代碼可以寫成

$(".page-left").on('click', '.randomDiv', function() 
{ 
    alert($(this.attr("id"))); 
} 

甚至

$(document).on('click', '.randomDiv', function() 
{ 
    alert($(this.attr("id"))); 
} 

結合事件在DOM

文檔級別取決於版本內jQuery你應該使用live，delegate，bind或on函數。