这是我的代码(简化版):
function FillTable ( oProfile_data ) {
var oTable = document.getElementById ( "table" );
for ( var key in oProfile_data ) {
var oRow = oTable.insertRow ( oTable.rows.length );
var oCell = oRow.insertCell ( 0 );
var oLink = document.createElement ( "a" );
oLink.href = "javascript:void(0)";
oLink.innerHTML = "Visit Homepage";
oLink.addEventListener ( "click",
function () {
var win = window.open ( oProfile_data [key]["url"], "_blank" );
win.focus();
}, false );
oCell.appendChild ( oLink );
}
}
问题是每一行都有指向同一个文档的链接,我不明白为什么!
我的临时解决方案是:
oLink.href = "javascript:void(0); var win = window.open ( \"" + oProfile_data [key]["url"] + "\", \"_blank\" ); win.focus();";
效果很好。 我想这是一个事件压倒一切的问题,但我可能错了。
非常感谢任何帮助!
最佳答案
这个问题可以通过理解闭包来解决。您的匿名函数(绑定(bind)到 click 事件)在用户单击链接之前不会被调用,并且当此行被执行时:
var win = window.open ( oProfile_data [key]["url"], "_blank" );
key
的值将包含在 FillTable
函数中。因此,它将保留函数结束时的值(即它在循环中保存的最后一个值)。
您必须为循环的每次迭代创建一个新的闭包。像这样的东西:
oLink.addEventListener ("click",
(function (k) {
return function () {
var win = window.open ( oProfile_data [k]["url"], "_blank" );
win.focus();
}
}
)(key), false);
上面,我们创建了一个返回打开窗口的函数。然后,我们将 key
的值传递给该函数,从而创建一个新的闭包。
关于javascript - 不需要的事件覆盖,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17903171/