You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何阻止Google Maps InfoWindow自动聚焦其内部首个可点击元素

Google Maps InfoWindow 自动聚焦问题解决方案

这个自动聚焦行为是Google Maps JavaScript API v3.45及以上版本为优化无障碍访问默认新增的逻辑,InfoWindow打开时会主动定位到内部第一个可交互元素。
以下是两种可行的禁用方案:

  • 方案1:使用官方原生配置(推荐,适配3.45+所有版本)
    初始化InfoWindow时在配置参数中添加focus: false,即可直接关闭自动聚焦逻辑,代码示例:
    const infoWindow = new google.maps.InfoWindow({
      content: '自定义HTML内容', // 你的原有InfoWindow内容配置
      focus: false // 新增此行禁用自动聚焦
    });
    
    该配置为官方针对该场景专门提供的参数,无额外副作用,适配你当前使用的3.45.8版本。
  • 方案2:手动触发失焦(适配特殊自定义场景)
    如果存在自定义的交互逻辑不适合直接用官方配置,可监听InfoWindow的domready事件,在内容渲染完成后手动取消当前聚焦:
    const infoWindow = new google.maps.InfoWindow({
      content: '自定义HTML内容'
    });
    
    // 监听InfoWindow内容渲染完成事件
    infoWindow.addListener('domready', () => {
      // 取消当前激活元素的聚焦状态
      if (document.activeElement) {
        document.activeElement.blur();
        // 也可选择将焦点重置到body元素上
        // document.body.focus();
      }
    });
    

内容的提问来源于stack exchange,提问作者mortenma71

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.09 22:42:04