javascript - 谷歌信息窗口: clicking on a link causes page to reload

标签 javascript google-maps

我正在对我必须设计的网页进行一些测试;因此,我编写了一些代码来在 map 上添加标记,并为每个标记添加一个包含一些信息的信息窗口:

function placeAttractionMarker(lat, lon, icon_path, name, url)
{
    //generate marker's info
    var contentString = '<div id="content"><div id="siteNotice">' +
    '</div><div id="bodyContent"><h4 id="firstHeading" class="firstHeading">' +  name + '</h4>' +
        '<a href=""' + url + ' style="text-decoration:none"><b>Sito web</b></a></div></div>';
    var infowindow = new google.maps.InfoWindow({
        content: contentString
    });

    var markerPos = new google.maps.LatLng(lat, lon);
    var marker = new google.maps.Marker
    (
        {
            position: markerPos,
            map: map,
            animation: google.maps.Animation.DROP,
            icon: icon_path,
            title: name
        }
    );

    marker.addListener('click', function() {
        infowindow.open(map, marker);
    });

    markers.push(marker);
}

为每个要添加到 map 的标记调用此函数:

 for(var j = 0; j<interest_points.length; j++)
    {
        placeAttractionMarker(
            interest_points[j].Lat,
            interest_points[j].Lon,
            "http://gmaps-samples.googlecode.com/svn/trunk/markers/orange/blank.png",
            interest_points[j].Name,
            interest_points[j].Wikipedia
        );
    }

生成的信息页面正确包含所有信息,包括 URL。不管怎样,当我点击 URL 时,包含 map 的页面就会被重新加载。 在我找到示例代码( Google Info Window )的网站上,单击页面会加载并替换为 map 。这是我不喜欢的行为,考虑到加载的页面无法滚动并且只有一部分可见(根据原始 map 的大小)。 我希望用户单击信息窗口内的链接并打开一个新选项卡,以显示加载的页面。

有什么想法吗? 谢谢。

最佳答案

乍一看,我认为'<a href=""' + url + '应该是'<a href="' + url + '"'这样您的 url 实际上位于 href 属性内。

关于javascript - 谷歌信息窗口: clicking on a link causes page to reload,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34358453/

相关文章:

javascript - 滚动到 jquery 或 js 中的子 div

javascript - 如何使用 jQuery 解析 json 并将其作为列表输出到 HTML 中?

javascript - 如何确定 WinJS.Promise 是否被超时或 cancel() 调用取消

.net - JavaScript:使用/关于 .NET String.Format() 等文化来格式化数字/货币?

javascript - OpenLayers - 在标记的矢量特征周围画一个框

android - 从谷歌地图搜索中读取文件 json 的问题

javascript - 如何访问 svg 文件的路径数据并将其用作谷歌地图标记?

javascript - 谷歌地图、 "is null or not an object"和 IE8

javascript - 如何移动谷歌地图标记并获取当前的纬度和经度

javascript - Google Map API - 本地图处于模态时,路线服务不会自动缩放