jQuery綁定到元素的順序？

Question

我在使用jQuery將一個函數綁定到一個元素時遇到了一些困難。基本上我有一組使用JSON加載的div。每個JSON項目都有一個關聯的「操作」，用於定義在單擊該div時要調用的函數。

我走過每一個JSON項目的重複，我（editied爲清楚起見）：

for (var i = 0; i < JSONOBJECT.length; i++) { 
    var divbox = $('<div id="' + i + '"><img /></div>'); 

    var action = JSONOBJECT[i]["action"]; 
    $(divbox).click(function() { 
     eval(action); // bind function 
    }); 

    $('.navigationarea').append(divbox); // Append to area 
} 

因此，例如，JSONOBJECT[0]["action"]可以包含"doThis()"，而JSONOBJECT[1]["action"]可以包含一個"doThis2()"。

問題是action總是最終成爲與JSON對象中最後一項關聯的操作。我知道這是一個與本地化變量（或製作副本？）有關的問題，但我錯過了它。

我可以得到一些幫助嗎？ 在此先感謝。

Answer 1

您的問題是action變量由所有匿名方法共享。

在您的具體情況下，最好的解決辦法是編寫divbox.click(new Function(action))。
這也會更快，因爲代碼只會被解析一次，而不是每次點擊一次。

通常，解決方案是將包含匿名函數的代碼放入單獨的函數中，並將該變量作爲參數傳遞給單獨的函數。

編輯：您的代碼可以寫成這樣：

for (var i = 0; i < JSONOBJECT.length; i++) { 
    $('<div id="' + i + '"><img /></div>') 
     .click(new Function(JSONOBJECT[i].action)) 
     .appendTo($('.navigationarea')); 
}