Javascript 我的按钮不是'；它不能在移动设备上工作，但可以在chrome上的移动模拟器上工作

试图让我的汉堡图标显示移动菜单从隐藏到块与“显示”，代码在桌面上与铬模拟器，但不是在实际的移动设备。 我的网站是www.rikuzit.co.il

window.onclick = function(event){
    var burger = document.getElementById("burgerIcon");
    var mobileMenu = document.getElementById("mobileMenu");


if(event.target == burger){
    alert("burger was pressed");
        console.log(event.target);
        mobileMenu.style.display = "block"; 
    } else {    
        alert("clicked outside burger");
        console.log(event.target);
        mobileMenu.style.display = "none";
    }
}

我希望当点击按钮时，菜单会出现。

如中所示，最好对移动设备使用

touchstart

：

window.ontouchstart = function(event){
    var burger = document.getElementById("burgerIcon");
    var mobileMenu = document.getElementById("mobileMenu");


if(event.target == burger){
    alert("burger was pressed");
        console.log(event.target);
        mobileMenu.style.display = "block"; 
    } else {    
        alert("clicked outside burger");
        console.log(event.target);
        mobileMenu.style.display = "none";
    }
}

---

你可以这样做

window.onclick = eventHandler
window.ontouch = eventHandler


function eventHandler(event){
   ...
}

（复制了舒巴姆·乔杜里的回答） 我希望这能奏效

window.onclick = eventHandler
window.ontouch = eventHandler


function eventHandler(event){
...
}

---

它对我有效，但现在，我如何检查用户是否在手机外点击以关闭它？我也尝试过使用“window”$（window）。在（'click touchstart'，function（）{$（'mobileMenu'）.css（'display'，'none'）上，如何检查“用户是否点击了除“mobile menu'”以外的任何内容？”是否有类似“！=”的内容？我想你误解了我的答案-你不需要jQuery。只需将

onclick

替换为

ontouchstart

，它就会工作。我会编辑我的答案。我的新问题是，当“mobileemu”出现时，我点击它，“else”语句就会启动，所以我尝试了如果（event.target==burger | | | event.target==mobileMenu{mobileMenu.style.display=“block”；}其他{display:none}；，我发现它不起作用，你有没有办法让手机在点击时保持在“display:block”中？为什么“| | event.target==mobileMenu”不起作用？好吧，我发现当我点击“mobileMenu”时，有时它是一个问题“li”被选中，有时是“a”，只有当我点击div（mobileMenu）的边框时，事件才是被触摸的div。