自动定位城市

时间 2019-12-14

标签自动定位城市栏目系统网络繁體版

原文原文链接

像美团等网站打开的时候，都会自动跳转到咱们访问者当前所在的城市，这样极大的提升了用户体验度，咱们如何实现这一功能呢？其实百度API里面有这个接口插件，根据用户的IP返回出用户所在的城市名。javascript

如下是我整理出来的完整范例，手机、pc端测试均可以正常获取出城市名，你们能够参考一下：html

<html>java

<head>api

<title>自动获取定位访问者当前城市</title>网站

ui

插件

</head>htm

<body>

// 百度地图API功能

var map = new BMap.Map("bdMapBox");

var nowCity = new BMap.LocalCity();

nowCity.get(bdGetPosition);

function bdGetPosition(result){

var cityName = result.name; //当前的城市名

/*自定义代码*/

atCity.innerHTML = cityName;

/*自定义代码*/

}

</script>

<p>您当前所在的城市为：<span id="atCity"></span></p>

</body>

</html>

运行效果：

说明一下：<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script> 没有密匙可能会在页面运行的时候弹出提示警告，为了让用户有更好的体验度，能够到百度地图开放平台 http://lbsyun.baidu.com/apiconsole/key 建立一个应用，就会获得一个密匙，填到这里就行了。

此文章转载于：http://www.daixiaorui.com/read/133.html，转载请注明是转载于http://www.daixiaorui.com/read/133.html网址