獲取使用者當前位置--Geolocation

直接上程式碼說明

<script>
  var x = document.getElementById("demo"); //指定html實作對象#demo
  //關鍵函式，執行後瀏覽器會跳請求通知
  function getLocation() {
    //用navigator這個Object確認瀏覽器支援性
    if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(showPosition, showError);
      //getCurrentPosition為geolocation的func.；參數1為success時執行，參數2為failed時執行
    } else {
      x.innerHTML = "您的瀏覽器不支援定位功能。";
    }
  }

  //getCurrentPosition成功時執行的函數，注意會帶一個position參數(重要!)
  function showPosition(position) {
    console.log(position); //等等另外來看position的內容
    x.innerHTML = "緯度: " + position.coords.latitude + "<br>經度: " + position.coords.longitude;
  }

  //getCurrentPosition失敗時執行的函數，注意會帶一個error參數
  function showError(error) {
    switch (error.code) {
      case error.PERMISSION_DENIED:
        x.innerHTML = "用戶拒絕位置請求。";
        break;
      case error.POSITION_UNAVAILABLE:
        x.innerHTML = "位置信息是不可用的。";
        break;
      case error.TIMEOUT:
        x.innerHTML = "請求用戶地理位置超時。";
        break;
      case error.UNKNOWN_ERROR:
        x.innerHTML = "未知錯誤發生。";
        break;
    }
  }
</script>

來看一下console.log出來的position內容

如此看懂經緯度的取值

position.coords.latitude

position.coords.longitude