JavaScript回调函数中的变量始终获取循环中的最后一个值？

我正在努力做到以下几点：

我有一组图像和选择（下拉）HTML元素，每个元素30个。我试图在1到30之间的循环中使用AddEventListener，这样当我更改select的值时，图像src会更新（并且图像会更改）

AddEventListener函数如下所示：

function AddEventListener(element, eventType, handler, capture)
{
    if (element.addEventListener)
        element.addEventListener(eventType, handler, capture);
    else if (element.attachEvent)
        element.attachEvent("on" + eventType, handler);
}

我试过这个，它成功了：

var urlfolderanimalimages = "http://localhost/animalimages/";
var testselect = "sel15";
var testimg = "i15";

AddEventListener(document.getElementById(testselect), "change", function(e) {
    document.getElementById(testimg).src = urlfolderanimalimages + document.getElementById(testselect).value;
    document.getElementById(testimg).style.display = 'inline';

    if (e.preventDefault) e.preventDefault();
    else e.returnResult = false;
    if (e.stopPropagation) e.stopPropagation();
    else e.cancelBubble = true;
}, false);

但后来我试着在一个循环中调用它，但它不起作用。该事件已添加，但当我更改任何select时，它将更新最后一个事件（id为i30的图像）

var urlfolderanimalimages=”http://localhost/animalimages/";
对于（k=1；k而言，问题在于您正在对同一变量进行“关闭”

var不声明变量1。它只是在给定的执行上下文中为标识符注释“停止查找”

请查看所有详细信息。关于“执行上下文”和“范围链”的部分最有趣

常见的习惯用法是执行双重绑定以创建新的执行上下文

例如


1此构造在ECMAScript规范中被称为变量声明。然而，尽管可能会被视为具有误导性，但强调此声明是为了阐明一点：另请参见“变量提升”。
我还在以下方面找到了此解决方案：

var myArr=[0,1,2,3]；
对于（var i=0；i
非常感谢您，太平洋标准时间。老实说，我对这本书还不太熟悉，所以昨晚我没有完全理解它（虽然时间很晚，我也很累，所以这可能是原因之一：p）。今天我会再看一次，看看我能不能把它做好。再次感谢！）
var urlfolderanimalimages = "http://localhost/animalimages/";

for (k=1;k<=30;k++) {
    var idselect = "sel" + k;
    var idimage = "i" + k;

    AddEventListener(document.getElementById(idselect), "change", function(e) {
        document.getElementById(idimage).src = urlfolderanimalimages + document.getElementById(idselect).value;
        document.getElementById(idimage).style.display = 'inline';

        if (e.preventDefault) e.preventDefault();
        else e.returnResult = false;
        if (e.stopPropagation) e.stopPropagation();
        else e.cancelBubble = true;
    }, false);

}

var k
for (k = 1; k < 10; k++) {
  setTimeout((function (_k) {
    return function () {
      alert(_k)
    }
  })(k), k * 100)
}

var k
for (k = 1; k < 10; k++) {
  setTimeout((function () {
     alert(this)
  }).bind(k), k * 100)
}

var myArr = [0,1,2,3]; 

for (var i = 0; i < myArr.length; i+=1) { 

(function (i) { 

    document.getElementById('myDOMelement' myArr[i]).onclick = function () { 

        if (window.console.firebug !== undefined) { 
            console.log('myDOMelement' myArr[i]); 
        } 
        else { 
                alert('myDOMelement' myArr[i]); 
        } 
        }; 
    }) (i); 
}