web手机端js获取用户当前详细地理位置

一、引入jquery和百度的地图api,如下所示:

<script type="text/javascript" src="skin/jquery.js"></script>
<script src="http://api.map.baidu.com/api?v=1.2" type="text/javascript"></script>

二、具体用法如下(直接复制即可,oppo手机亲测有效):

<script>
    $(function(){
        getLocation();
    })
    
    function getLocation() {
        var options = {
            enableHighAccuracy : true,
            maximumAge : 1000
        }
        if (navigator.geolocation) {
            //浏览器支持geolocation
            navigator.geolocation.getCurrentPosition(onSuccess, onError,
                    options);
        } else {
            //浏览器不支持geolocation
            alert('您的浏览器不支持地理位置定位');
        }
    }
    //成功时
    function onSuccess(position) {
        debugger
        //返回用户位置
        //经度
        var longitude = position.coords.longitude;
        //纬度
        var latitude = position.coords.latitude;
        /* alert('经度'+longitude+',纬度'+latitude); */

        //根据经纬度获取地理位置,不太准确,获取城市区域还是可以的
        var map = new BMap.Map("allmap");
        var point = new BMap.Point(longitude, latitude);
        var gc = new BMap.Geocoder();
        gc.getLocation(point, function(rs) {
            var addComp = rs.addressComponents;

            alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber); 
           // $("#inp").html(addComp.city);
        });
    }
    //失败时
    function onError(error) {
        switch (error.code) {
        case 1:
            alert("位置服务被拒绝,请点击刷新重试!");
            break;
        case 2:
            alert("暂时获取不到位置信息,请点击刷新重试!");
            break;
        case 3:
            alert("获取信息超时,请点击刷新重试!");
            break;
        case 4:
            alert("未知错误,请点击刷新重试!");
            break;
        }
    }
   
</script>

 

    原文作者:yjm2017
    原文地址: https://blog.csdn.net/sxl2017/article/details/103563813
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞