javascript - 添加事件监听器

Question

我试图为同一个事件创建两个事件监听器。

直到我意识到你不能真正做到这一点 - 例如:

thumbnailPageButton.addEventListener("click", onThumbnailPageButton, false);
thumbnailPageButton.addEventListener("click", alertSomething);

所以我把我想要的代码放在“onThumbnailPageButton”下，并删除了“alertSomething”部分。

/* Event handler for click events dispatched by ThumbnailPageButton to update the visibility of UI elements. */
function onThumbnailPageButton(event){
    updateUI();
    alert("Yes you clicked it!");
}

然而，这似乎打破了这一切。并且缩略图图标现在将不会显示。

Answer 1

您可以在同一个对象上执行相同事件类型的多个监听器 - 我想这就是您想要做的。见下文。

你的代码有一些奇怪的东西。您将其标记为 JQuery 但没有使用 JQuery(看起来像 $('#thumbnailPageButton').click(function(){etc}))。另外，您没有调用您的函数alertSomething(您的代码中也没有列出该函数)。试试这个:

var thumbnailPageButton = document.getElementById('thumbnailPageButton');
thumbnailPageButton.addEventListener("click", onThumbnailPageButton, false);
thumbnailPageButton.addEventListener("click", alertSomething);


function onThumbnailPageButton(){
    alert('hey');
}

function alertSomething(){
   alert('here');
}

在这里摆弄:https://jsfiddle.net/anwh0epe/