移动端菜单点击内部链接不消失的JavaScript问题求助

我来帮你搞定这个菜单不关闭的问题！你原来的JavaScript代码确实有几个语法和选择器的错误，我给你修正并解释清楚：

原代码的问题点 #

• document.getElementById(mobilemenuitems a) 写法完全错误：getElementById只能通过ID查找元素，不能用类名+后代选择器；而且参数没加引号，语法不合法。
• 你的菜单容器是类名为mobilemenuitems，不是ID，所以不能用getElementById来获取。

正确的解决方案（事件委托写法） #

因为你没办法给链接加类或ID，用事件委托是最适合的方式——给菜单容器绑定点击事件，判断点击的是不是链接，再关闭菜单。

// 等页面DOM加载完成再执行代码，避免找不到元素
document.addEventListener('DOMContentLoaded', function() {
  // 获取类为mobilemenuitems的菜单容器
  const mobileMenu = document.querySelector('.mobilemenuitems');
  
  // 确保找到菜单元素再执行后续逻辑
  if (mobileMenu) {
    // 给菜单容器绑定点击事件
    mobileMenu.addEventListener('click', function(e) {
      // 判断点击的目标是不是<a>标签（链接）
      if (e.target.tagName === 'A') {
        // 隐藏菜单容器，这里可以根据你网站的实际情况调整隐藏方式
        // 如果网站是用CSS类控制菜单显示/隐藏，比如有个"active"类，就改成：mobileMenu.classList.remove('active');
        mobileMenu.style.display = 'none';
      }
    });
  }
});

代码解释 #

1. DOMContentLoaded：确保页面所有元素都加载完成后再执行代码，避免出现找不到菜单元素的情况。
2. querySelector('.mobilemenuitems')：正确获取类名为mobilemenuitems的菜单容器，替代你错误的getElementById写法。
3. 事件委托：不需要给每个链接单独绑定事件，只要监听菜单容器的点击，通过e.target判断点击的是不是链接，这样即使菜单里的链接是动态生成的也能生效。
4. 隐藏逻辑：用style.display = 'none'直接隐藏菜单，如果你的网站原本是用CSS类（比如show/active）控制菜单显示，把这行改成移除对应类即可，更贴合原有代码逻辑。

额外提示 #

如果希望点击菜单的任何区域都关闭菜单（不只是链接），可以去掉if (e.target.tagName === 'A')这个判断条件，直接在点击事件里隐藏菜单。

内容的提问来源于stack exchange，提问作者BB23