특정 클래스의 HTML 요소에 이벤트 추가

Question

저는 모달 창에서 작업 중이므로 가능한 한 재사용 가능한 기능을 만들고 싶습니다. 그 말은, "모달"과 같은 클래스로 몇 개의 앵커 태그를 설정하고, 특정 앵커 태그를 클릭하면 해당 ID를 가져 와서 전달 된 ID를 기반으로 다른 함수를 실행할 함수로 전달합니다. .

// this gets an array with all the elements that have a class equals to "modal" 
var anchorTrigger = document.getElementsByClassName('modal'); 

가 그럼이 수행하여 배열의 각 항목에서 addEventListener를 설정하려고 : 이것은 내가 지금까지 무엇을 가지고

var anchorTotal = anchorTrigger.length; 
for(var i = 0; i < anchorTotal ; i++){ 
    anchorTrigger.addEventListener('click', fireModal, false); 
} 

을 한 후 마지막 함수 "fireModal"를 실행하는 과 같이, 모달 열립니다 :

function fireModal(){ 
    //some more code here ... 
} 

내 문제가 "에 대한"루프, 내가 anchorTrigger.addEvent가 ... 함수 아니라고 말하는 오류가 발생하는 것입니다. 이 오류는 개별 요소에 반대되는 배열에 "addEventListener"를 설정하려고한다는 사실과 관련이 있다고 말할 수 있지만 내가 무엇을해야할지 모르겠다. 도움을 주시면 대단히 감사하겠습니다.

Answer 1

anchorTrigger[i].addEventListener...