Question

当我点击手机上的链接时，我想提示询问用户是否允许检测位置，如果是，请打开Google地图，其中包含从当前位置开始的路线到最终目的地。

这就是我所拥有的，但当我点击链接时，它会转到后备默认链接。

<a class="geo" href="http://maps.google.com/maps?ll=40.822419,-73.993124">Get Directions</a>

$("a.geo").click(function(e)) {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(getLoc, handle_errors);
    }
    e.preventDefault();
});

function getLoc(position) {
    var geoLat = position.coords.latitude;
    var geoLon = position.coords.longitude;
    var gmapLink = "http://maps.google.com/maps?saddr=" + geoLat + "," + geoLon + "&daddr=40.822419,-73.993124";
    $("a.geo").attr("href", gmapLink);
}

在用户点击链接后，如何使用用户位置的新链接替换href？

Answer 1

替换更改href属性的行：

$("a.geo").attr("href", gmapLink);

带有重定向：

window.location.assign(gmapLink);

在e.preventDefault()区块中移动if (navigator.geolocation)也是值得的，这样如果没有可用的地理位置，用户仍然可以访问谷歌地图并自行插入其位置。

Answer 2

以下适用于我。请注意，我将上下文代理到getLoc函数，因此$（this）仍然是我们在获取回调时按下的链接，并添加了一个单击触发器来实际单击该链接。另一种解决方案是使用window.location。

$("a.geo").click(function(e) {               
    if (navigator.geolocation) {
        e.preventDefault();
        navigator.geolocation.getCurrentPosition(
             $.proxy( getLoc, $(this) )                    
            , handle_errors);          
    }
});

function getLoc(position) {                     
    var geoLat = position.coords.latitude;
    var geoLon = position.coords.longitude;
    var gmapLink = "http://maps.google.com/maps?saddr=" + geoLat + "," + geoLon + "&daddr=40.822419,-73.993124";        
    $(this).attr("href", gmapLink);
    $(this).trigger('click');
}

地理定位谷歌地图链接jQuery

2 个答案: