JavaScript onClick事件函数

Question

我正在尝试将 onClick 事件添加到我在此处创建的按钮：https://makerlist.io/smart-feature-finder/。我正在添加一个 "Hello, World!" 语句，该语句在单击按钮进行测试时出现。这是我正在使用的代码，但是什么也没有出现。关于我遗漏的任何想法？

document.getElementsByClassName(".esg-filterbutton").addEventListener("click", myFunction);

function myFunction() {
    alert ("Hello, World!");
}

谢谢，

乔纳汉

Answer 1

您的 select 或 returns 一个 array-like 对象称为 HTMLCollection 而不是单个元素。

试试，

document.getElementsByClassName("esg-filterbutton")[0].addEventListener("click", myFunction);

注意到我正在获取数组中的第一个元素吗？

我还删除了 class 名称前的 .。当您指定要在函数中 select a class 时，您不需要放置 .。

Answer 2

如果您希望将事件应用到所有按钮，可以将 click 事件绑定到具有 class esg-filterbutton 的元素。

$('.esg-filterbutton').click(function()
{
    alert ("Hello, World!");
});

这是一个例子：https://jsfiddle.net/DinoMyte/Lb1wj47j/