移动端Chrome点击地址触发谷歌地图弹窗的禁用方案咨询

针对你遇到的问题，这里有几个可行的解决办法：

• 给目标元素添加禁用检测属性
  Chrome移动端支持通过特定属性禁用地址识别功能，直接给你的div加上x-apple-data-detectors="false"和data-detectors="false"即可，修改后的代码如下：

  <div role="option" tabindex="-1" id="address_list_item0" x-apple-data-detectors="false" data-detectors="false">
    25 George Bush Blvd Apt E<span class="description">Delray Beach FL 33444-4067</span>
  </div>
  

  这两个属性能让浏览器跳过对该元素内文本的地址识别，不会触发地图弹窗，同时不影响你原本的点击填输入框功能。

• 拆分地址文本，破坏浏览器识别逻辑
  把完整的地址拆分成多个小元素，让浏览器无法识别为有效地址，比如：

  <div role="option" tabindex="-1" id="address_list_item0">
    <span>25 George Bush Blvd Apt E</span><span class="description"><span>Delray Beach</span> <span>FL</span> <span>33444-4067</span></span>
  </div>
  

  这种方式不需要依赖属性兼容性，适合所有场景。

• 全局禁用页面地址检测
  如果你整个页面都不需要浏览器自动识别地址，可以在页面头部添加meta标签：

  <meta name="format-detection" content="address=no">
  

  这样页面内所有地址文本都不会被浏览器识别触发弹窗，但会影响其他可能需要地址识别的区域，按需使用。

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