в JavaScript, функция в цикле не может получить доступ к переменному циклу объема

Question

он основан на JQuery Easy UI

Предположат, что здесь есть HTML код

<div id="menu" class="easyui-menu" style="width:120px;"> 
    <div>New</div> 
    <div> 
     <span>Open</span> 
     <div style="width:150px;"> 
      <div><b>Word</b></div> 
      <div>Excel</div> 
      <div>PowerPoint</div> 
     </div> 
    </div> 
    <div data-options="iconCls:'icon-save'">Save</div> 
    <div class="menu-sep"></div> 
    <div>Exit</div> 
</div> 

Проблема, если настройка меню в цикле, функция всегда вызывается последним утверждением, т.е. i всегда равна 4 в console.log(itemLabel + i + "is selected.");

$(function(){ 
    var jqMenu = $("#menu"); 
    for (var i = 0; i < 5; i++) { 
    var itemLabel = "item " + i; 
    // correct 
    var onclickFunction = function(){ 
     console.log(itemLabel + i + "is selected."); 
    } 

    jqMenu.menu("appendItem",{ 
     "text":itemLabel, 
     "onclick": function(){ 
     console.log(itemLabel + " is selected."); 
     } 
    }); 
    } 
}) 
$(document).bind('contextmenu',function(e){ 
       e.preventDefault(); 
    $("#menu").menu('show', { 
     left: 200, 
     top: 100 
    }); 
}); 

Answer 1

проблему вы столкнулись аЬ ove можно решить с помощью закрытий. У меня была эта задача, и я решил ее с помощью закрытий.

Измените ваш код, чтобы он соответствовал этому. Попробуйте использовать этот формат в своем коде.

for (var i = 0; i < 5; i++) { 
    (function(x){ 
     console.log(x); 
    })(i); 
} 

Answer 2

Да, использовать функцию для создания закрытия помогло бы также проверить этот ответ: https://stackoverflow.com/a/3572616/883571

Лично я предложил бы использовать forEach, чтобы обойти эту проблему:

[1,2,3,4,5].forEach(function(i) { 
    console.log(i) 
});