我有一个很简单的JS使用navigator。geolocation。getcurrentposition jammy。

$(document).ready(function(){
  $("#business-locate, #people-locate").click(function() {
    navigator.geolocation.getCurrentPosition(foundLocation, noLocation);
  });

  navigator.geolocation.getCurrentPosition(foundLocation, noLocation);

  function foundLocation(position) {
    var lat = position.coords.latitude;
    var lon = position.coords.longitude;
    var userLocation = lat + ', ' + lon;
    $("#business-current-location, #people-current-location").remove();
    $("#Near-Me")
      .watermark("Current Location")
      .after("<input type='hidden' name='business-current-location' id='business-current-location' value='"+userLocation+"' />");
    $("#people-Near-Me")
      .watermark("Current Location")
      .after("<input type='hidden' name='people-current-location' id='people-current-location' value='"+userLocation+"' />");
  }
  function noLocation() {
    $("#Near-Me").watermark("Could not find location");
    $("#people-Near-Me").watermark("Could not find location");
  }
})//end DocReady

基本上,这里发生的事情是我们得到当前位置,如果它得到了,两个“水印”被放置在两个字段中,表示“当前位置”,两个隐藏字段被创建,并使用latong数据作为它们的值(它们在开始时被删除,这样它们就不会每次都重复)。还有两个按钮,它们有一个点击功能,做同样的事情。 不幸的是,每隔三次左右,它就会奏效。 这里有什么问题?


当前回答

我终于找到了一个工作版本的firefox, chrome和默认导航器在android(仅4.2测试):

function getGeoLocation() {
        var options = null;
        if (navigator.geolocation) {
            if (browserChrome) //set this var looking for Chrome un user-agent header
                options={enableHighAccuracy: false, maximumAge: 15000, timeout: 30000};
            else
                options={maximumAge:Infinity, timeout:0};
            navigator.geolocation.getCurrentPosition(getGeoLocationCallback,
                    getGeoLocationErrorCallback,
                   options);
        }
    }

其他回答

@brennanyoung的回答很好,但如果你想知道在失败的情况下该怎么做,你可以使用IP地理定位API,如https://ipinfo.io(这是我的服务)。这里有一个例子:

function do_something(coords) {
    // Do something with the coords here
    // eg. show the user on a map, or customize
    // the site contents somehow
}

navigator.geolocation.getCurrentPosition(function(position) { 
    do_something(position.coords);
    },
    function(failure) {
        $.getJSON('https://ipinfo.io/geo', function(response) { 
        var loc = response.loc.split(',');
        var coords = {
            latitude: loc[0],
            longitude: loc[1]
        };
        do_something(coords);
        });  
    };
});

详情见https://ipinfo.io/developers/replacing-getcurrentposition。

大家也一样,顺便说一句,这在Chrome(稳定,开发和金丝雀)中工作完美,只是在FF和Safari中不合适。它在我的iPhone和iPad上也很好用(Safari!)这可能是由于这个功能相对较新(即它是一个bug)。我现在花了差不多一个星期的时间在这个上面,我就是不能让它在那些浏览器上工作

以下是我的发现:

第一次调用getCurrentPosition时,它工作得很完美。任何后续调用都不会返回,也就是说,它不会触发successCallback或errorCallback函数。为了证明我的观点,我在看涨期权中添加了几个仓位选项:

 navigator.geolocation.getCurrentPosition(successCallback, errorCallback,  {timeout: 10000});

并且每次都超时(在第一次成功调用之后)。我认为我可以用maximumAge来修复它,但这似乎并不像它应该工作的那样工作:

navigator.geolocation.getCurrentPosition(successCallback, errorCallback,  {maximumAge:60000, timeout: 2000});

这应该防止实际调用getCurrentPosition函数,如果你在60秒内调用它,但它忽略了这一点(然而,这可能是因为我实际上刷新了我的页面来触发第二次调用,不确定这是否持久跨调用)

顺便说一句,即使谷歌的例子失败在这些浏览器上,这让我相信这确实是浏览器的bug,尝试一下,在Safari中加载两次,第二次就不会工作了。

如果有人找到了解决方案,请告诉我:-)

欢呼。

我发现,这种方法行不通

navigator.geolocation.getCurrentPosition(function() {...}, function(err) {...}, {});

But

这种方法非常有效

function storeCoordinates(position) {
    console.log(position.coords.latitude, position.coords.longitude);
}    

function errorHandler() {...}

navigator.geolocation.getCurrentPosition(storeCoordinates, errorHandler, { enableHighAccuracy: true, timeout: 20000, maximumAge: 0 });

我最近自己也注意到了这个问题,我不确定它是怎么来的,但它有时会出现firefox在缓存中加载的东西上卡住。在清除缓存并重新启动firefox后,它似乎再次发挥作用。

也许这对一些人有帮助,在Android上我也有同样的问题,但我用它解决了 setTimeout 内部 document.ready 所以它为我工作第二,你必须增加超时以防万一,如果用户允许他的位置几秒钟后,所以我保持它为60000毫秒(1分钟)允许我的成功函数调用,如果用户点击允许按钮在1分钟内。