如何在使用 javascript 生成的锚标记上添加 onclick 事件？答案

【问题标题】：how to add onclick event on anchor tag that is generated with javascript?如何在使用 javascript 生成的锚标记上添加 onclick 事件？
【发布时间】：2012-08-15 22:26:46
【问题描述】：

我只使用 javascript，而不是 jQuery 或其他 javascript 框架。

我创建了一个锚标记，例如：

var _a = document.createElement('a');

现在我想为这个标签添加 onclick。我试过以下：

_a.onclick = function(){ mycode(id); }

该函数适用于此，但锚标记是在循环中创建的...所以mycode(id) 始终采用循环的最后一个值。

谁能帮帮我？

【问题讨论】：

向我们展示整个循环。你只需要一个闭包。
Javascript function is using the last known parameters in loop?、Javascript - Dynamically assign onclick event in the loop 等的可能副本
向下滚动到“闭包循环”here

标签： javascript

【解决方案1】：

for(var id = 0; id < 10; id++){
    var _a = document.createElement('a');
    _a.onclick = (function(id){
        return function (){
            mycode(id);
        }
    })(id);
}

这应该可以解决它。

【讨论】：

【解决方案2】：

您可能需要一个函数来创建您的处理程序，如下所示：

function createHandler( id ) {
  return function(){ mycode( id ); };
}

然后在循环内赋值

for ( i= ... ) {
   _a.onclick = createHandler( i );
}

另一方面，您可能应该使用addEventListener() (MDN docu) 向元素添加事件：

_a.addEventListener( 'click', createHandler( i ) );

【讨论】：

【解决方案3】：

尝试以下：

_a.onclick = (function(id){return function(){ mycode(id); }})(id);

【讨论】：