codepenジオロケーションが機能しない

Question

私のスニペットでhere、 navigator.geolocationの機能をテストしています。しかし、Webブラウザはロードされた後に場所の許可を与えるよう促します。どうしてこれなの？

var x = $("#location"); 
function getLocation() { 
    if (navigator.geolocation) { 
    navigator.geolocation.getCurrentPosition(showPosition); 
    } else { 
    x.innerHTML = "Geolocation is not supported by this browser."; 
    } 
} 
function showPosition(position) { 
    x.innerHTML = "Latitude: " + position.coords.latitude + 
    "<br>Longitude: " + position.coords.longitude; 
} 

Answer 1

ちょうど代わりにinnerHTMLプロパティのjQueryのhtmlの（）メソッドを使用します。

は、ここに私のコードです。

var x = $("#location"); 
function getLocation() { 
    if (navigator.geolocation) { 
    navigator.geolocation.getCurrentPosition(showPosition, error); 
    } else { 
    x.html("Geolocation is not supported by this browser."); 
    } 
} 
function showPosition(position) { 
    console.log(position) 
    x.html("Latitude: " + position.coords.latitude + 
    "<br>Longitude: " + position.coords.longitude); 
} 
function error(err){ 
    console.log(err) 
} 

getLocation();