移动端的H5页面提供了定位的功能,那么如何实现一个最简单的需求-----获取用户当前城市?php
你可能搜一下就会找到N篇博客介绍,可是你会发现你看完大段代码以后仍是没搞清楚,为了便于你们理解,我精简了代码,只保留了必要的部分。html
一、在html页面引入百度地图API(文档地址:http://developer.baidu.com/map/wiki/index.php?title=jspopular/guide/introduction)git
<script src="http://api.map.baidu.com/api?ak=你的AK码&v=2.0&services=false"></script>
二、js代码使用h5的geolocation方法获取坐标,而后使用百度api的getlocation方法翻译成你想要得结果api
1 navigator.geolocation.getCurrentPosition(function (position) { 2 var lat = position.coords.latitude; 3 var lon = position.coords.longitude; 4 var point = new BMap.Point(lon, lat); // 建立坐标点 5 // 根据坐标获得地址描述 6 var myGeo = new BMap.Geocoder(); 7 myGeo.getLocation(point, function (result) { 8 var city = result.addressComponents.city; 9 $('body').html(city); 10 }); 11 });
三、打开手机试一下吧jsp
若是不须要精准的定位,还有一种经过IP地址获取当前城市的方法,采用新浪的api接口。ide
<script src="http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js"></script> <script> var city = remote_ip_info['city']; alert(city) </script>