更新了一版源葫，首頁也會自動定位并提示切換
https://github.com/MiuMiu-S/Locate-current-City

效果.png

正在獲取.png

失敗.png

功能說明：

????點(diǎn)擊獲取城市，獲取當(dāng)前位置的經(jīng)緯度，然后轉(zhuǎn)換為城市信息
????獲取成功正常顯示
????超過10秒未獲取到或者獲取失敗顯示“獲取超時點(diǎn)擊重試”
????如果獲取到的城市不在城市列表中，顯示“獲取失敗點(diǎn)擊重試”

HTML

<div class="position" id="baidu_geo">點(diǎn)擊獲取城市</div>
<div class="city">
    <p>當(dāng)前定位城市</p>
    <span class="info baidu_map" id="baidu_geo"><span>
    <img src="../../images/v2/Loading_icon2-2.gif">正在獲取定位</span></span>
    <input type="hidden" value="">
    <img src="../../images/v2/indexrefresh@2x.png" style="display: none;"> <!--為了避免網(wǎng)路不佳情況下，定位失敗圖標(biāo)請求不到-->
</div>

JS

<script src="http://api.map.baidu.com/api?v=2.0&amp;ak=申請的key"></script>
<script src="http://api.map.baidu.com/getscript?v=2.0&amp;ak=申請的key&amp;services=&amp;" type="text/javascript"></script>
var t, city;
function refresh() {
    $("#baidu_geo").addClass("baidu_map");
    $(".baidu_map").html('<span><img src="../../images/v2/Loading_icon2-2.gif">正在獲取定位</span>');
    setTimeout(function() {
        if ($("#baidu_geo").next("input").attr("value").length == 0) {
            $("#baidu_geo").removeClass("baidu_map").html('<span onclick="refresh()" style="color: #f05156;"><img src="../../images/v2/indexrefresh@2x.png">定位獲取超時,請點(diǎn)擊重試</span>');
        }
    }, 10000);
    baiduPosition(35);
}
$$('.position').on('click', function() {
    myApp.popup('.popup-about2');
    // 定位城市信息
    clearTimeout(t);
    $("#baidu_geo").next("input").attr("value", "");
    $("#baidu_geo").addClass("baidu_map");
    $(".baidu_map").html('<span><img src="../../images/v2/Loading_icon2-2.gif">正在獲取定位</span>');
    t = setTimeout(function() {
        if ($("#baidu_geo").next("input").attr("value").length == 0) {
            $("#baidu_geo").removeClass("baidu_map").html('<span onclick="refresh()" style="color: #f05156;"><img src="../../images/v2/indexrefresh@2x.png">定位獲取超時,請點(diǎn)擊重試</span>');
        }
    }, 10000);
    baiduPosition(35);
});
// 定位城市信息
function positions(json, cid) {
    //不寫報錯
};
function baiduPosition(cid) {
    console.log("shihongfanghshshsshhhsh")
    $(".baidu_map").html('<span><img src="../../images/v2/Loading_icon2-2.gif">正在獲取定位</span>');
    var geolocation = new BMap.Geolocation();
    geolocation.getCurrentPosition(function(r) {
        if (this.getStatus() == BMAP_STATUS_SUCCESS) {
            var position = {
                lng: r.point.lng,
                lat: r.point.lat
            }
            if (cid == 'sort') {
                sort(position);
            } else {
                positions(position, cid);
            }
            //console.log('您的位置：' + r.point.lng + ',' + r.point.lat)
            translateCallback(r.point.lng, r.point.lat)
        } else {
            //alert('獲取當(dāng)前位置失敗,請確定您開啟了定位服務(wù)');
            $(".baidu_map").html('<span onclick="baiduPosition(35)" style="color: #f05156;"><img src="../../images/v2/indexrefresh@2x.png">定位獲取失敗,請點(diǎn)擊重試</span>');
        }
    }, {
        enableHighAccuracy: true
    });
};

function translateCallback(lng, lat) {
    var latlon = lat + ',' + lng;
    var url = "http://api.map.baidu.com/geocoder/v2/?ak=申請的key&callback=renderReverse&location=" + latlon + "&output=json&pois=0";
    var xhr = $.ajax({
        type: "GET",
        dataType: "jsonp",
        url: url,
        beforeSend: function() {
            $(".baidu_map").html('<span><img src="../../images/v2/Loading_icon2-2.gif">正在獲取定位</span>');
        },
        success: function(json) {
            if (json.status == 0) {
                $(".baidu_map").siblings("input").val(json.result.addressComponent.city + "-" + json.result.addressComponent.district)
                city = json.result.formatted_address.split("市")[0] + "市";
                console.log(city)
                var cityinfo = $(".popup-about2 .warp span").text().split("市");
                if ($.inArray(json.result.formatted_address.split("市")[0], cityinfo) == -1) {
                    $(".baidu_map").html('<span onclick="baiduPosition(35)" style="color: #f05156;"><img src="../../images/v2/indexrefresh@2x.png">定位獲取失敗,請點(diǎn)擊重試</span>');
                } else {
                    $(".baidu_map").html('<span class="close-popup1" onclick="setPresentAddressPrev(this)">' + city.split("市")[0] + '市</span>');
                }
            }
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            $(".baidu_map").html('<span onclick="baiduPosition(35)" style="color: #f05156;"><img src="../../images/v2/indexrefresh@2x.png">定位獲取失敗,請點(diǎn)擊重試</span>');
        }
    });
}