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元素的集合，因此请使用indexer访问返回的每个元素。

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

要使用jQuery，你可以这样做

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