的addEventListener不是函數

Question

我有HTML這樣

<p class="trigger-overlay"> 

，但得到的addEventListener的錯誤不是一個函數

function toggleOverlay(){alert('fire');}; 
var triggerBttn = document. getElementsByClassName('trigger-overlay'); 
triggerBttn.addEventListener('click', toggleOverlay); 

我用的ID和它的工作，但我希望能夠到觸發多個類。

function toggleOverlay(){alert('fire');}; 
var triggerBttn = document. getElementById('trigger-overlay'); 
triggerBttn.addEventListener('click', toggleOverlay); 

Answer 1

功能getElementsByClassName方法將返回HTML元素的集合，使得使用索引來訪問每個元素返回。

for(i=0; i < triggerBttn.length; i++) 
    triggerBttn[i].addEventListener('click', toggleOverlay); 

要使用jQuery做它，你可以不喜歡

$('.triggerBttn').click(toggleOverlay);