버튼을 클릭했을 때 indexOf를 사용하여 배열의 인덱스 값을 찾으려고 시도합니다.

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

이 시도 : 그 내용은

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>

Answer 2

을 사용할 수 :

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; 
} 

다음을 수행하십시오.