Problem mit Geolocation in IE11

Question

Ich habe den folgenden Code, der den Benutzer auffordert, ihre aktuelle Position im Browser zuzulassen, wenn sie auf den Standortlink klicken/klopfen.

Dies funktioniert gut in Chrome, Safari und Firefox, aber ich kann es nicht in IE11 arbeiten. Manchmal zeigt es die Browserbenachrichtigung für den Benutzer, um seinen Standort anzugeben, aber dann passiert nichts.

Ich fragte mich, ob jemand anderes Probleme mit Google Maps hatte und den Standort in IE11 anfragte und ob jemand eine Lösung hat?

<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

Das funktionierte wirklich für mich auf IE11 ohne Änderungen, wenn ich es auf Codepen ausprobiert:

$(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

Das Einzige, was ich kann vorschlagen Überprüfen Sie die Entwicklerkonsole, um festzustellen, ob beim Testen Fehler aufgetreten sind.

Answer 2

Ich habe dies unter Windows 8 versucht. Wenn die Standorteinstellungen auf dem Computer (siehe Systemsteuerung/Standorteinstellungen ändern) deaktiviert sind, wird eine Fehlermeldung zurückgegeben. In dem obigen Code "passiert nichts". „Error“ und „# location-link“ teilen nicht die gleichen Eltern, so dass diese Linie nicht die Fehlermeldung angezeigt:

$("#" + thisid).parent().find("#error").html("Error: " + positionError.message + "<br />") 

Ist das Problem der Verhinderung von „Geo-Standort nicht eingeschaltet“ -Meldung auf Client-Computern angezeigt werden?