0

我正在尝试将事件动态添加到我的项目中。要添加多个事件的位置。很难描述项目的功能,所以我创建了一个非常简单的示例代码来演示我正在尝试创建的功能。我正在尝试创建多个事件侦听器以使用 for 循环,并且该事件侦听器的主体在其执行中使用 for 循环迭代器变量。但是,问题在于所有事件侦听器中只使用了 for 循环的最后一个值。请参考下面的代码。

<script>
   function addlisteners() {
      var allinputs = document.body.getElementsByTagName("input");

      for ( var i = 0; i < allinputs.length; i++ ) {
          allinputs[i].onclick = function() {
          alert("hii, I am" + i + "input field");
          }
      }
  }
  window.onload = function() {
     for ( var i = 0; i < 10; i++ ) {
        var input = document.createElement("input");
        document.body.appendChild( input );
     }
     addlisteners();
 }
</script>
</head>

<body>
</body>

所以,如果代码被执行并尝试,你会看到点击所有的输入框会显示 i 的最后一个值,像这样,“hii,我是 10 输入字段”。如果您知道如何创建此事件处理程序以显示适当的 i 值,请回答。IE; 输入框 1 的“hii, I am 1 input field”和输入框 2 的“hii, I am 2 input field”等等。非常感谢您的参与。

4

1 回答 1

0

将您的代码段更改为

 allinputs[i].onclick = (function(x) {
        //alert("hii, I am" + j + "input field");
        return function(){
          alert("hii, I am" + x + "input field");
        }
  })(i);

FIDDLE,引用自Here

于 2013-09-26T07:39:59.723 回答