点击带有__mPS2id类的锚点链接时，jQuery移除移动端导航menu_mobile的opened类失效问题排查

我来帮你分析下这段jQuery代码没生效的可能原因，对应的解决办法也整理好了：

1. 先确认代码是否在DOM加载完成后执行 #

如果你的代码在页面元素还没渲染完就跑了，那肯定找不到.__mPS2id元素，自然触发不了点击事件。解决办法是把代码包裹在DOM就绪的回调里：

jQuery(document).ready(function($) {
  // 这里用$也没问题，因为回调里的$就是jQuery的别名
  $('.__mPS2id').on('click', function(e) { 
    $('.menu_mobile').removeClass('opened'); 
  });
});

2. 动态元素要改用事件委托 #

如果你的移动端菜单是通过JS动态生成的（比如点击按钮才加载出来），直接给.__mPS2id绑定事件会失效——因为绑定事件的时候这些元素还不存在。这时候得用事件委托，把事件绑定到已经存在的父元素上，比如菜单的容器#menu_mobile：

jQuery(document).ready(function($) {
  $('#menu_mobile').on('click', '.__mPS2id', function(e) { 
    $('.menu_mobile').removeClass('opened'); 
  });
});

这样不管子元素什么时候生成，点击事件都会被父元素捕获并执行你的逻辑。

3. 检查mPS2id插件的事件干扰 #

mPS2id插件本身会给这些锚点链接绑定点击事件，有可能它的事件处理函数里用了e.stopPropagation()或者e.preventDefault()，导致你的事件没触发。你可以先加个调试语句验证：

jQuery(document).ready(function($) {
  $('.__mPS2id').on('click', function(e) { 
    console.log('点击事件触发了！'); // 打开浏览器控制台，点击链接看有没有这个输出
    $('.menu_mobile').removeClass('opened'); 
  });
});

• 如果控制台没输出：说明事件没绑定到元素上，回到前两个原因排查；
• 如果有输出但类没移除：那可能是.menu_mobile的选择器有问题，你可以在控制台执行$('.menu_mobile')，看看能不能找到目标元素，以及它的类列表里有没有opened。

4. 验证选择器的准确性 #

有时候可能是选择器写错了，比如.menu_mobile是不是有父元素限制？或者页面里有多个.menu_mobile元素？你可以在浏览器控制台执行以下命令，确认是否选中了正确的元素：

console.log($('.menu_mobile')); // 看返回的DOM元素是否是你要操作的那个
console.log($('.menu_mobile').hasClass('opened')); // 看是否存在opened类

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