如何排查google.maps.InfoWindow内链接点击无响应问题？

遇到这种事件被莫名拦截的情况，不用盲目翻庞大的代码库，试试这些快速定位的实用办法：

• 用浏览器开发者工具精准捕捉事件流
  打开Chrome或Firefox的开发者工具（按F12），切换到「Sources」面板，找到左侧的「Event Listener Breakpoints」，展开「Mouse」分类，勾选「click」和「mousedown」。当你点击那个没反应的链接时，调试器会自动停在触发的事件处理函数上，顺着调用栈往上回溯，就能一眼看到有没有代码调用了preventDefault()或者stopPropagation()来拦截事件。

• 给链接绑定一个“插队”的点击事件
  直接在浏览器控制台里给目标链接加个优先级更高的监听，绕过可能存在的事件委托：

  const targetLink = document.querySelector('a[href="/go/some/where.htm"]');
  targetLink.addEventListener('click', function(e) {
    e.stopImmediatePropagation(); // 阻止后续其他监听触发
    console.log('链接点击已触发！');
    window.location.href = this.href; // 强制跳转，验证是否能正常生效
  }, true); // 第三个参数设为true，让事件在捕获阶段就执行，抢在其他监听前面
  

  如果这样能成功跳转，说明确实有其他事件处理函数在冒泡阶段拦截了点击；如果还是没反应，那大概率是InfoWindow的DOM结构有特殊处理，比如被动态移除、或者有透明遮罩层挡住了链接。

• 检查InfoWindow的DOM层级与样式干扰
  在「Elements」面板里找到InfoWindow对应的DOM元素，仔细查看它的父级或同级元素有没有设置pointer-events: none的CSS样式，或者有没有绝对定位的空div（遮罩层）覆盖在链接上方。有些地图组件会给InfoWindow加一层遮罩来处理自身交互，这会直接挡住内部链接的点击事件。

• 临时禁用全局事件委托做测试
  如果你怀疑是全局的事件监听（比如绑定在document或body上的click事件）在搞鬼，可以在控制台临时移除它们做测试：

  // 临时移除document上所有click监听（刷新页面就会恢复，放心测试）
  const clickEvents = getEventListeners(document).click || [];
  clickEvents.forEach(evt => document.removeEventListener('click', evt.listener, evt.useCapture));
  

  之后再点击链接，如果能正常触发，就说明问题出在全局事件委托里，再去代码里定位对应的逻辑即可。

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