汉堡菜单问题答案

【问题标题】：Hamburger menu issue汉堡菜单问题
【发布时间】：2020-02-17 03:22:18
【问题描述】：

我知道这个问题可能会被问很多，但是有人可以帮我解决这个问题。

所以问题是我正在尝试制作一个移动汉堡菜单，并且我想让 onclick 事件在有人点击图标时发生。

function toggleMenuFunction() {
  let  getSidebar = document.querySelector(".sidebar");

    if(getSidebar.style.display === 'none'){
        getSidebar.style.display = 'block';
    }else if ( getSidebar.style.display === 'block'){
        getSidebar.style.display = 'none';
    }
}

我试过这样做，但它不会做任何事情。请问谁能帮帮我？

【问题讨论】：

没有插入完整和重要的代码没有人可以帮助你，请包含更多信息和代码。
查看codepen.io/mranenko/pen/wevamj 展示了如何正确实现汉堡菜单。

标签： javascript hamburger-menu

【解决方案1】：

如果你想在点击一个元素时触发一个函数，你也需要编写它；）

document.onload = () => document.querySelector(".sidebar").addEventListener("click",toggleMenuFunction);

document.onload 确保在文档完全加载后附加侦听器。注意：您的代码中只能有一个document.onloadassignment。为此目的编写包装函数几乎总是一个好主意。如：

document.onload = () => { 
 document.querySelector(".sidebar")
   .addEventListener("click",toggleMenuFunction);
}

【讨论】：