javascript - Google Maps API - 无法点击信息窗口中的链接

标签 javascript google-maps infowindow marker

我在使用 Javascript 的 GoogleMaps API v3 中遇到了 InfoWindow 的问题。我已经成功创建了一个信息窗口,我可以在里面设置任何内容,但是我想在里面放一个超文本链接。它工作正常,我通常将标记放在 setContent() 方法中,并且链接正确显示在窗口中。不幸的是,它不可点击 - 它附有正确的链接,但当我点击它时,没有任何反应。当我通过右键单击它并选择“在新窗口中打开”时,它工作正常。任何人都可以在这里找到问题吗?我有一个简单的代码如下:

var bubble;

... some lines not related to the bubble ...

bubble = new google.maps.InfoWindow({
  maxSize: new google.maps.Size(500,250)
});

... other not related lines...

然后我在创建标记的事件中触发它(对标记工作正常):

bubble.setContent('<a href="http://www.google.com">LINK</a>');

google.maps.event.addListener(marker, 'click', function() {
   bubble.open(map, marker)
});

“ map ”和“标记”都很好。

最佳答案

我遇到了同样的问题。我相信这是因为信息窗口内容作为 div 动态插入到 DOM 中造成的。我不知道为什么会这样,但我是这样解决的:

  1. 使用 jQuery(我已经在使用这个 - 如果您使用替代的 js 库,可能有相同的等效解决方案)
  2. 更新 html 链接以定义一个类(比如 class="infowindow_link")
  3. 添加一个 jQuery 处理程序来捕获链接并跟随它

    $(".infowindow_link").live('点击', function(){ window.location.href=this.href; });

这个“实时”调用跟踪 DOM 的变化并将监听器附加到您插入的任何新链接。 window.location.href 更新是点击链接的正常行为。

关于javascript - Google Maps API - 无法点击信息窗口中的链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5721488/

相关文章:

javascript - 在链接的鼠标悬停效果上加载 div 中的网页

android - 如何使谷歌地图多个标记信息窗口保持打开状态android

javascript - 用于获取私有(private)文件的 AWS S3 签名 url

javascript - Lerna 能否根据 Conventional Commits 规范提升预发布版本?

android - 如果手机上未安装谷歌播放服务,如何在 Android 应用程序中显示 map

android - 如何在 Fragment 中获取 Google Maps 对象

javascript - 谷歌地图 - 如何更改谷歌地图信息窗口文本

javascript - 将 javascript var 传输到 html 表单文本框

javascript - Javascript 正则表达式中的字母

java - 谷歌距离矩阵api奇怪