Jquery范圍問題

Question

我無法弄清楚這個范圍問題：

var menuLinks = new Array("about.php", "contact.php");
function setClickListeners()
{
    for(var i=0; i<menuItems.length; i++)
    {
        $("#" + menuItems[i]).click( function () {
            window.alert(menuLinks[i]);
        });
    }
}

注意：menuItems和menuLink的長度相同。 這個代碼被剝離，以便更容易理解。

單擊項目時此代碼的結果是警報“未定義”。 它應該是來自menuLinks的數據。

救命！！！！

弗蘭基

Answer 1

for (var i=0; i < menuItems.length; i++) {
    (function(i) {
         $("#"+menuItems[i]).click(function() {
              alert(menuLinks[i]);
         });
    }(i));
}

您需要在.click為您的匿名函數設置i的當前值。

JavaScript只有函數范圍。 所以，如果你不把i地方，然后只要你按點擊的價值i是電流值在這種情況下是menuItems.length - 1 。

你的上面做的是創造一個新的功能范圍和傳遞的價值i進去，這樣的電流值， i停留在該功能范圍不變。 這樣你的click函數就會從閉包中獲取i的常量值。

JSLint的

讓我們過度復雜化代碼並滿足jslint。

var wrapper = function(i) {
    $("#"+menuItems[i]).click(function() {
         alert(menuLinks[i]);
    });
};

for (var i=0; i < menuItems.length; i++) {
    wrapper(i);
}

Answer 2

更清潔的代碼：

var menuLinks = new Array("about.php", "contact.php");
function setClickListeners()
{
    $.each(menuLinks, function(i, element)
    {
        $("#" + menuItems[i]).click( function (e) {
            alert(menuItems[i]);
            e.preventDefault();
        });
    }
}