我如何才能阻止我的引导汉堡包图标和可折叠菜单在单击时跳转？

<div id="menu-toggle">
  <!-- 汉堡包图标 -->
  <div class="icon"></div>
  <!-- 可折叠菜单 -->
  <ul class="menu">
    <li>菜单项1</li>
    <li>菜单项2</li>
    <li>菜单项3</li>
  </ul>
</div>

document.getElementById("menu-toggle").addEventListener("click", function(event) {
  event.preventDefault(); // 阻止默认的跳转行为
});

document.getElementById("menu-toggle").addEventListener("click", function(event) {
  event.preventDefault();
  var menu = document.querySelector("#menu-toggle .menu");
  menu.classList.toggle("active"); // 切换菜单的展开/关闭状态
});