Question

我有以下代码，当用户点击/点击位置链接时，请求用户在浏览器中允许他们当前的位置。

这在Chrome，Safari和Firefox中运行良好，但我无法在IE11中使用它。有时它会显示用户提供位置的浏览器通知，但之后没有任何反应。

我想知道是否有其他人在使用Google地图并在IE11中请求位置以及是否有人有解决方案时会遇到问题？

<p id="error"></p>
<form action="/" method="post">
<a class="location-link" id="location-link" href="#"><img src="/static/images/icons/location.png" alt="Get your current location" title="Get your current location" /></a><input type="text" name="location" value="" placeholder="Find a salon" >
<input class="viewbtn3" value="Submit" type="submit"></form>
<script src="/static/js/jquery.1.9.1.js"></script>
<script src="https://maps.google.com/maps/api/js?sensor=true"></script>

<script type="text/javascript">
$(document).ready(function() {
    if (typeof navigator.geolocation == "undefined") {
        $("#error").text("Your browser doesn't support the Geolocation API");
        $(".location-instruction span").hide();
        $(".location-link").hide();
        return;
    }
    $("#location-link").click(function(event) {
        event.preventDefault();
        var addressId = this.id.substring(0, this.id.indexOf("-"));
        var thisid = $(this).attr("id");
        //console.log(thisid);
        navigator.geolocation.getCurrentPosition(function(position) {
            var geocoder = new google.maps.Geocoder();
            geocoder.geocode({
                location: new google.maps.LatLng(position.coords.latitude, position.coords.longitude)
            }, function(results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    $("#" + thisid).parent().find('input[name="location"]').val(results[0].formatted_address);
                    $(".choose_wrap").addClass('sucess');
                } else {
                    $("#" + thisid).parent().find("#error").html("Unable to retrieve your address<br />");
                    $(".choose_wrap").addClass('fail');
                }
            })
        }, function(positionError) {
            $("#" + thisid).parent().find("#error").html("Error: " + positionError.message + "<br />")
        }, {
            enableHighAccuracy: true,
            timeout: 10 * 1000
        })
    });
});
</script>

Answer 1

这实际上对我来说在IE11上没有变化，当我在Codepen上试用它时：

$(document).ready(function() {
    if (typeof navigator.geolocation == "undefined") {
        $("#error").text("Your browser doesn't support the Geolocation API");
        $(".location-instruction span").hide();
        $(".location-link").hide();
        return;
    }
    $("#location-link").click(function(event) {
        event.preventDefault();
        var addressId = this.id.substring(0, this.id.indexOf("-"));
        var thisid = $(this).attr("id");
        //console.log(thisid);
        navigator.geolocation.getCurrentPosition(function(position) {
            var geocoder = new google.maps.Geocoder();
            geocoder.geocode({
                location: new google.maps.LatLng(position.coords.latitude, position.coords.longitude)
            }, function(results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    $("#" + thisid).parent().find('input[name="location"]').val(results[0].formatted_address);
                    $(".choose_wrap").addClass('sucess');
                } else {
                    $("#" + thisid).parent().find("#error").html("Unable to retrieve your address<br />");
                    $(".choose_wrap").addClass('fail');
                }
            })
        }, function(positionError) {
            $("#" + thisid).parent().find("#error").html("Error: " + positionError.message + "<br />")
        }, {
            enableHighAccuracy: true,
            timeout: 10 * 1000
        })
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://maps.google.com/maps/api/js?sensor=true"></script>
<p id="error"></p>
<form action="/" method="post">
  <a class="location-link" id="location-link" href="#"><img src="/static/images/icons/location.png" alt="Get your current location" title="Get your current location" /></a>
  <input type="text" name="location" value="" placeholder="Find a salon">
  <input class="viewbtn3" value="Submit" type="submit">
</form>

http://codepen.io/anon/pen/oXZxgz

我唯一可以建议的是检查开发者控制台，看看测试时是否有任何错误。

Answer 2

我在Windows 8上尝试过此操作。如果计算机上的位置设置（请参阅控制面板/更改位置设置）已关闭，则会返回错误消息。在上面的代码＆＃34;没有任何反应＆＃34;。＆＃34;＃错误＆＃34;和＃34;＃location-link＆＃34;不要共享同一个父级，因此该行不会显示错误消息：

files : [
    // Must be before xstaticPath + '**/*.js' to be included
    '../test-main.js',
    {pattern: xstaticPath + '**/*.js', included: false},
    {pattern: '../../test-shim.js', included: false},
    {pattern: 'horizon/**/*.js', included: false},
    {pattern: 'dashboard-app/**/*.js', included: false},
    {pattern: 'framework/**/*.js', included: false},
    {pattern: '**/*.spec.js', included: false}

],

此问题是否阻止＆＃34;地理位置未开启＆＃34;来自客户端计算机上的消息？

Answer 3

这可能是Windows设置，至少在我看来是这样。尝试转到“设置”（在Windows的“开始”菜单中搜索）>“隐私”>“位置”，然后将“位置=打开”。

IE11中的地理位置问题

3 个答案: