onClick事件中传递参数

onClick事件中传递参数

我正在尝试在onclick事件中传递参数。下面是一个示例代码:

<div id="div"></div>

<script language="javascript" type="text/javascript">
   var div = document.getElementById('div');

   for (var i = 0; i < 10; i++) {
       var link = document.createElement('a');
       link.setAttribute('href', '#');
       link.innerHTML = i + '';
       link.onclick=  function() { onClickLink(i+'');};
       div.appendChild(link);
       div.appendChild(document.createElement('BR'));
       }

   function onClickLink(text) {
       alert('Link ' + text + ' clicked');
       return false;
       }
    </script>

但是,每当我单击任何链接时,警报始终显示“链接10已单击”!

谁能告诉我我在做什么错?

谢谢

最佳答案

发生这种情况是因为一旦调用该函数,i就会向上扩展作用域。您可以使用闭包来避免此问题。

for (var i = 0; i < 10; i++) {
   var link = document.createElement('a');
   link.setAttribute('href', '#');
   link.innerHTML = i + '';
   link.onclick = (function() {
      var currentI = i;
      return function() {
          onClickLink(currentI + '');
      }
   })();
   div.appendChild(link);
   div.appendChild(document.createElement('BR'));
}

或者,如果您想要更简洁的语法,建议您使用Nick Craver的解决方案。

关于javascript - 在Javascript onClick事件中传递参数,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/3495679/

10-09 06:16