获取地理位置

最新推荐文章于 2021-07-23 16:27:10 发布

qq_36320160

最新推荐文章于 2021-07-23 16:27:10 发布

阅读量204

点赞数

分类专栏：前端文章标签： h5

原文链接：https://www.mk2048.com/blog/blog.php?id=hh0ikicichaa&title=%E8%8E%B7%E5%8F%96%E5%9C%B0%E7%90%86%E4%BD%8D%E7%BD%AE

版权

前端专栏收录该内容

520 篇文章 2 订阅

订阅专栏

可根据获取到的经纬度查询到所在的地理位置。

    <p><button onclick="geoFindMe()">Show my location</button></p>
    <div id="out"></div>
    <script>
        function geoFindMe() {
            
            var output = document.getElementById("out");

            output.innerHTML = "<p>Locating…</p>";
            
            if ("geolocation" in navigator) {
                /* 地理位置服务可用 */
                navigator.geolocation.getCurrentPosition(success, error);
            } else {
                /* 地理位置服务不可用 */
                output.innerHTML = "<p>地理位置服务不可用</p>";
            }

            // 成功调用
            function success(position) {
                var latitude = position.coords.latitude;
                var longitude = position.coords.longitude;
                output.innerHTML = "经度:"   longitude   "<br/>纬度:"   latitude;
            }

            // 失败调用
            function error() {
                output.innerHTML = "无法获取您的位置";
            }

        }
    </script>