HTML5新特性,地理定位(Geolocation)

HTML5 Geolocation(地理定位)用于定位用户的位置。鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的。

一、示范代码

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <!--引入百度 API,"ak=" 后面一串码是密钥,最好自己申请-->
    <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=7a6QKaIilZftIMmKGAFLG7QT1GLfIncg"></script>
</head>
<body>
    <input type="button" onclick="getLocation()" value="查询当前位置" />
    <div id="position">当前没有结果,请单击查询</div>
    <script type="text/javascript">
    var x = document.getElementById('position');
    function getLocation() {
        // 创建百度地理位置实例,代替 navigator.geolocation
        x.innerHTML = '正在查询,请稍候……';
        var geolocation = new BMap.Geolocation();
        geolocation.getCurrentPosition(function(e) {
            if(this.getStatus() == BMAP_STATUS_SUCCESS){
                // 百度 geolocation 的经纬度属性不同,此处是 point.lat 而不是 coords.latitude
                x.innerHTML = '纬度:' + e.point.lat + '<br/>经度:' + e.point.lng;
            } else {
                x.innerHTML = 'failed' + this.getStatus();
            }
        });
    }
    </script>
</body>
</html>

二、查询结果

本文参考:

https://www.runoob.com/html/html5-geolocation.html

原文地址:https://www.cnblogs.com/nayitian/p/14959181.html