[javaScript] navigator.geolocation / 方法 Method / 事件委派 Event Delegate - Slash Engineer 要多斜有多斜

Breaking

Slash Engineer 要多斜有多斜

程式設計的學習過程 (環境設置、開發環境、程式設計、語法練習、資料結構等等...) 99'暑假：六月初開始. 社會新鮮人：十一月初開始.

2017年11月14日 星期二

[javaScript] navigator.geolocation / 方法 Method / 事件委派 Event Delegate

<!DOCTYPE html>
<html>
<head>
    <title></title>
<meta charset="utf-8" />
</head>
<body>
    <table>
        <tr>
            <th>Latitude</th>
            <th>Longitude</th>
        </tr>
        <tr>
            <td id="latitude"></td>
            <td id="longitude"></td>
        </tr>
    </table>
    <script>
        //1.
        var geo = navigator.geolocation;
        //2.為什麼這邊不用給參數，而是直接call兩個function即可?
        //Ans : 因為geo.getCurrentPosition(x,x)原來就是要接position / error的callback參數
        //但這邊的做法是用"事件委派"的方式接position / error，所以只要在showCoords, errorHandler的方法內，
        //分別宣告接入的參數即可。
        geo.getCurrentPosition(showCoords, errorHandler);
        //3.
        function showCoords(position){
            var lat = position.coords.latitude;//緯度
            var lon = position.coords.longitude;//經度

            document.getElementById("latitude").innerHTML = lat.toString();
            document.getElementById("longitude").innerHTML = lon.toString();
        }
        //4.
        function errorHandler(error) {
            switch (error.code) {
                case error.TIMEOUT:
                    alert("Geolocation Timeout!");
                    break;
                case error.POSITION_UNAVAILABLE:
                    alert("Geolocation Position Unavailable!");
                    break;
                case error.PERMISSION_DENIED:
                    alert("Geolocation Permission Denied!");
                    break;
                default:
                    alert("Geolocation Unknow Error: " + error.code);
            }
        }
    </script>
</body>
</html>

Read more
Posted by Price:
Product Tags:

沒有留言:

張貼留言

問題沒有大小或好壞

訂閱： 張貼留言 (Atom)