一个完整的可以输出移动端当前省市(地理坐标)的html页面
作者:互联网
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>获取用户地理位置</title>
<script type="text/javascript" src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<p>页面加载弹窗获取用户地理位置</p>
</body>
</html>
<script>
//获取当前位置的经纬度
function getCoordinate(){
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(
function (position) {
let latitude = position.coords.latitude
let longitude = position.coords.longitude
getProAndCity(latitude,longitude)
},
function (e) {
throw(e.message);
}
)
}
}
// 通过当前经纬度和百度map查找对应省市
function getProAndCity(latitude,longitude){
$.ajax({
url: 'http://api.map.baidu.com/geocoder/v2/?ak=wWYw0yCb8ntXmSgTxTx40vKR&callback=renderReverse&location=' + latitude + ',' + longitude + '&output=json&pois=1',
type: "get",
dataType: "jsonp",
jsonp: "callback",
success: function (data) {
alert(data.result.addressComponent.province);
alert(data.result.addressComponent.city);
alert(data.result.addressComponent.district);
if (typeof callback == "function") {
callback(data);
}
} ,
error:function(){
alert('err')
}
});
}
getCoordinate()
</script>
<style>
</style>
有些机型没效果,在改
标签:function,longitude,alert,callback,html,地理坐标,latitude,data,页面 来源: https://www.cnblogs.com/wd163/p/13213371.html