2

我目前正在学习 Javascript，现在我在搞乱事件监听器。

但是我有一个问题，当我在一个循环中创建事件监听器时，我无法弄清楚如何将一个持续存在的变量传递给它。我制作了一个脚本，当我单击它时将元素移动到指定位置。但是现在它把所有元素放在同一个位置，所以出于某种原因，它们都得到了相同的数字。

不管我是否这样传递：

var index = i;    

applications[i].addEventListener('click', function(){ 

 
var posLeft2 = 10*index+"%";

 var iconstyleO =  " text-align: center; "+
" font: bold 22px Tahoma; "+
" position:fixed; "+
" top: 67%; "+
" left: "+posLeft2+"; "+
" display:block; "+
" margin: 150px auto; "+
" color: #ffffff; "+
" z-index: 3; "+
" -webkit-border-radius: 10px; "+
" background: rgb(140,140,140); "+
" width: 10%; "+
" height: 10%; ";

this.setAttribute('style',iconstyleO); 
     }  ,false);

或像这样：

var index = i;    

applications[i].addEventListener('click', function(index){ 

 
var posLeft2 = 10*index+"%";

 var iconstyleO =  " text-align: center; "+
" font: bold 22px Tahoma; "+
" position:fixed; "+
" top: 67%; "+
" left: "+posLeft2+"; "+
" display:block; "+
" margin: 150px auto; "+
" color: #ffffff; "+
" z-index: 3; "+
" -webkit-border-radius: 10px; "+
" background: rgb(140,140,140); "+
" width: 10%; "+
" height: 10%; ";

this.setAttribute('style',iconstyleO); 
     }  ,false);

他们仍在将事件侦听器设置为相同的位置。在最后一个元素的位置，或者在第一个元素的位置，这取决于我如何尝试传递它。

有任何想法吗？

4

1 回答 1

4

Javascript 没有块作用域。
因此，您所有的回调都共享同一个变量。

要解决此问题，您需要将代码包装在IIFE中，以便每个回调都有自己的闭包：

(function(index) {
    applications[i].addEventListener('click', function(){ 
        ...
    });
})(i);
于 2012-12-31T17:48:38.577 回答