Question

我正在使用Adobe Animate CC进行画布项目。我有一个数组，我指定事件监听器是这样的：

for(var i = 0; i < navBtnArray.length; i++ ){
navBtnArray[i].addEventListener("click", navigationControls);
}

我想弄清楚的是如何捕获在数组中单击的按钮的索引值。我试过这样：

function navigationControls(e){

console.log(navBtnArray.indexOf(this));
}

但是这一直持续-1。这也是Animate CC，所以我无法访问jQuery。 Animate使用CreateJS和EaselJS库。我以前在AS3中使用indexOf，但它看起来并没有完全相同的方式。

Answer 1

为此，您可以使用：

function navigationControls(e){
    console.log(navBtnArray.indexOf(e.target));
}

如果仍然无法正常工作且indexOf无法比较此类对象，您可以尝试为按钮对象添加额外属性，例如：

for(var i = 0; i < navBtnArray.length; i++ ){
     navBtnArray[i].addEventListener("click", navigationControls);
     navBtnArray[i].index = i;
}

然后执行：

function navigationControls(e){
    console.log(e.target.index);
}

Answer 2

试试这个：

 var navBtnArray = document.getElementsByClassName('demo');
for(var i = 0; i < navBtnArray.length; i++ ){
(function(index){
      navBtnArray[i].onclick = function(){
              console.log(index)  ;
        }    
    })(i);

}

<button class="demo">hi</button>
<button class="demo">hi</button>
<button class="demo">hi</button>
<button class="demo">hi</button>
<button class="demo">hi</button>

单击按钮时，尝试使用indexOf查找数组的索引值

2 个答案: