jQuery的頁面

Question

附加我使用Ajax來獲得一些信息到我的網頁

在陣列接收，所以我使用的循環將它們添加到我的html頁面這樣的信息：

for i to i less than my information i++ 

$('#ul').append("<li>"+info[i]+"</li>"); 

但我想爲每個'li'標籤添加一個不同的.click事件，但我不想爲此再循環一次。有沒有簡單的方法來做到這一點？

我想這些解決方案，但似乎沒有任何工作：

A）

for i to i less than my information i++ 

$('#ul').append( $("<li>"+info[i]+"</li>").click(function(){alert(i)}) ); 

回最後一個 「我」 的價值爲所有這些

B）

for i to i less than my information i++ 

$('#ul').append("<li>"+info[i]+"</li>").find('li:last-child').click(function({alert(i)}) ); 

還返回所有人的最後「i」值

有沒有簡單的方法來做到這一點？

Answer 1

下進行了測試，並且按預期工作：

info = ["Jonathan","Sampson","Programming"]; 

$(info).each(function(i){ 
    $("<p>"+info[i]+"</p>").click(function(){ 
    alert(i); 
    }).prependTo("body"); 
}); 

Answer 2

在點擊的時候，我會被設置爲循環中的最後一個項目。所以，你必須將數據存儲在李，是這樣的：

$('#ul').append( $("<li>"+info[i]+"</li>").data('num',i).click(function() {alert($(this).data('num'));}) ); 

Answer 3

$.each(info, function() { 
    $("<li></li>").text("...").click(function() { 
    // do stuff 
    }).appendTo("#ul"); 
}); 

Answer 4

您有正在訪問的回調，這是一個封閉的可變i的問題。

下面是一個相關的SO問題，可以幫助你。我想你也可以使用jQuery的.each()功能，從第2的代碼片段中接受的答案：
Access outside variable in loop from Javascript closure

鏈接的「關閉」頁面還介紹了你的問題正是：
http://matthew-marksbury.blogspot.com/2008/12/javascript-closures-and-scope.html

Answer 5

嘗試，這將是更好

//這裏綁定一次事件!:

$(function(){ 
    $("#parent>li").live("click", function(){ 
    alert($(this).html());   
});  

// your data 
var info = ["a", "b", "c"]; 

var list = []; 
$.each(info, function(index, item){ 
    list.push("<li>"); 
    list.push(item);    
    list.push("</li>");    
}); 

$("#parent").append(list.join("")); 


// you page like this(it has an id property): 

<ul id="parent"></ul>