從li獲取動態創建的值

Question

我想從我創建的動態LI獲取值。

我發現這個answer，它解釋瞭如何正常獲取它。

這是我的代碼。這適用於我在我的LI上的兩個元素。

<ul class="nav nav-pills nav-stacked" id="listPreReq" style="height: 200px; overflow: auto" role="menu"> 
    <li class="active"><a href="#">Action</a></li> 
    <li><a href="#">Another action</a></li> 
</ul> 


$("#listPreReq li").click(function() {  
alert($(this).html()); 
}); 

但我有添加更多元素到LI的選項。我添加的所有新元素都不會觸發$（「＃listPreReq li」）。click事件。不知道爲什麼。這是一個demo。

$('#btPre').click(function(e) { 
    var Psize= $("#listPreReq").find("li"); 
    Psize = Psize.size()+1; 
    $("#listPreReq").append('<li><a href="#">Page '+Psize+'</a></li>'); 
}); 

Answer 1

Solution Demo

而是結合事件的記錄，你甚至可以將它們綁定到ul ：

$("#listPreReq").on('click', 'li', function() {  
    alert($(this).html()); 
}); 

看一看event delegation。

Answer 2

使用$(document).on('click','#btPre',function(e) {...而不是$('#btPre').click(function(e) {...它會被解僱！它被稱爲事件代表團！

UPDATE：還這部分太：

$("#listPreReq li").click(function() {... 

將其更改爲：

$(document).on('click',"#listPreReq li",function() {...