一个类的事件监听器？

Question

我有一个引用 Id 的 EventListener 并且它运行良好，唯一的问题是我至少有十几个地方需要引用这个 EventListener，所以我不想有十几个脚本都一样但有不同的 Id . 有没有办法让 EventListener 引用一个我可以在我需要的所有地方使用的类。谢谢

爪哇脚本：

document.getElementById("chartJump").addEventListener("click", function (e) { e.preventDefault() });

HTML：

<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenuGraphOne">
    <!--DROPDOWN MENU-->
    <li role="presentation"><a role="menuitem" tabindex="-1" id="chartJumpOne" href="#graphOneChart">Chart</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" id="tableJumpOne" href="#graphOneData">Data</a></li>
</ul>

Answer 1

是的，使用类。每个元素都应该有一个公共类。使用 jQuery，您可以这样做：

$(document).ready(function () {
  $(".className").click(function (e) {
    e.preventDefault();
  });
});

获取有关$.click()和 的更多信息$.ready()。当您添加jquery 时，我已经给出了 jQuery 解决方案。

使用 vanilla JavaScript，您可以通过两种方式实现相同的功能：

对于旧浏览器：

window.onload = function () {
  list = document.getElementsByClassName("className");
  for (var i = 0; i < list.length; i++) {
    list[i].addEventListener("click", function (e) {
        e.preventDefault();
    });
  }
};

对于新浏览器：

window.onload = function () {
  list = document.querySelectorAll(".className");
  for (var i = 0; i < list.length; i++) {
    list[i].addEventListener("click", function (e) {
        e.preventDefault();
    });
  }
};