javascript - 动态绑定(bind) onclick 事件为 for 循环中的所有按钮提供相同的值

Question

我正在尝试动态创建按钮并在点击事件中为每个按钮分配一个警报功能。这是 javascript 函数:

function GetTabs(tabObj) {
   for (var t = 0; t < tabObj.views.view.length; t++) {               
        var podObjlen = '';
        var element = document.createElement('input');
        element.id = "btn" + t;
        element.setAttribute("type", "button");
        element.setAttribute("value", "Click");
        element.setAttribute("name", "button");
        podObjlen = tabObj.views.view[t].pod.length;
        document.body.appendChild(element);
        document.getElementById('btn' + t).onclick = (this, "onclick", function {
           alert(podObjlen);                    
        });                
    }
}

无论我单击哪个按钮，警报总是向我显示所有按钮循环中的最后一个值，即长度值被分配给所有警报。它不会为按钮的每个警报分配独立的值。我尝试了几种方法，例如:

element.getElementById('btn' + t).onclick = (this, "onclick", function {
    alert(podObjlen);                    
}); 
element.getElementById('btn' + t).onclick = new function () {
    alert(podObjlen);
}

(这里它在警报框中显示了正确的值，但我不断收到警报，但是当我实际单击按钮时警报无法触发，即警报在我的按钮呈现时触发。希望我说清楚。我想要的是我需要在循环运行时获取实际值以提醒每个按钮。

Answer 1

Adnan 您观察到的是 javascript 中臭名昭著的循环问题。发生这种情况是由于对 javascript 的工作原理了解较少，在此之前的帖子中也对此进行了讨论

Javascript infamous Loop issue?