第一步:需要在百度地图开发者平台创建一个应用:http://lbsyun.baidu.com/apiconsole/key/create

配置信息

申请配置成功以后返回一个AK

第二步:引入百度地图的js脚本,地址为http://api.map.baidu.com/api?v=2.0&ak=(申请应用的AK)

第三步:通过BMap.Geolocation()和getCurrentPosition(function(){})函数进行定位操作,代码如下图

//获取当前城市
var geolocation=new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
if(this.getStatus()==BMAP_STATUS_SUCCESS){
var lat=r.address.lat//当前经度
var lng=r.address.lng//当前纬度
var province=r.address.province //返回当前省份
var city=r.address.city//返回当前城市
console.log(city)
$('.cityName').text(city)
}
})

H5地理定位获取用户当前位置、城市的更多相关文章

  1. 手机端网页使用html5地理定位获取位置失败的解决办法

    网上有很多关于html5 geolocation 获取地理定位的方法,我试了下,只有在IE edge浏览器可以成功获取到,在chrome,firefox,手机端的safari,QQ浏览器,微信浏览器, ...

  2. 微信小程序:获取地理定位和显示相应的城市名称。

    最近在看微信小程序,遇到地理定位显示城市名称的问题.本文就是记录这一过程. 解决方案                                                          ...

  3. 获取用户当前位置信息的两种方法——H5、微信

    在之前的 调用百度地图API的总结 中获取当前位置信息我用的是 H5 ,其实微信也提供了获取用户地理位置的方法,现将这两种方法都贴出来,看情况选择使用. 一.H5 获取当前地理位置得到经纬度 // H ...

  4. html5获取用户当前位置

    支持地理定位的浏览器有IE9+.Firefox 3.5+ .Opera 10.6+ .Safari 5+ .Chrome.iOS 版Safari.Android版WebKit. navigator.g ...

  5. iOS下获取用户当前位置的信息

    #import <MapKit/MKMapView.h> @interface ViewController (){ CLLocationManager *_currentLoaction ...

  6. HTML5 02. 多媒体控件、拖拽事件、历史记录、web存储、应用程序缓存、地理定位、网络状态

    多媒体 video:是行内块(text-align: center; 对行内块适用) <figure></figure>: 多媒体标签 : <figcaption> ...

  7. 微信小程序之获取用户位置权限(拒绝后提醒)

    微信小程序获取用户当前位置有三个方式: 1. wx.getLocation(多与wx.openLocation一起用) 获取当前的精度.纬度.速度.不需要授权.当type设置为gcj02 返回可用于w ...

  8. 基于浏览器的HTML5地理定位

    基于浏览器的HTML5地理定位 地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML ...

  9. 使用navigator.geolocation来获取用户的地理位置信息

    使用navigator.geolocation来获取用户的地理位置信息 W3C 中新添加了一个名为 Geolocation的 API 规范,Geoloaction API的作用就是通过浏览器获取用户的 ...

随机推荐

  1. pb加密转换成C#

    本来想把PB 的函数封装成COM组件调用,结果怎么都搞不定,只能讲代码搞出来换种语言实现了. string s_ret integer i_first,i_second,i_third,i_fourt ...

  2. Java入门笔记 06-常用类

    介绍:本章将介绍Java的一些常用类,内容不完整,会在后续使用过程中逐步完善. 一. 字符串相关类: 1. String类介绍: |--- String类声明为final的,不能被继承: |--- 实 ...

  3. Linux - Shell后台、前台,运行命令

    后台运行(终端能操纵) 只需要在后面加& gedit & 查看正在运行的jobs jobs 放到前台运行(终端不能操作) fg % fg %1 一个终端一个context.一个终端就是 ...

  4. MySQL - Schema和Database的区别

    问题来源 在pycharm发现Create new schema的效果和新建数据库一样,所以产生这个问题 参考 https://stackoverflow.com/questions/11618277 ...

  5. .NET Core快速入门教程 3、使用VS Code开发.NET Core控制台应用程序

    一.前言 本篇开发环境 1.操作系统: Windows 10 X642.SDK: .NET Core 2.0 Preview3.VS Code:1.14 二.安装&配置 1.VS Code下载 ...

  6. jq基础(2)

    jquery的选择器 基本选择器 id选择器:$(“#id名称”); 元素选择器:$(“元素名称”); 类选择器:$(“.类名”); 通配符:* 多个选择器共用(并集) 案例代码: <html& ...

  7. java 事务解释。

    面试的时候,面试人员总喜欢问在spring中, 1. 如果一个主线程上有一个事务,在事务中开启了一个线程.子线程跑出异常,对主线程有没有影响,或者主线程产生异常对子线程有没有影响. 这个时候,你只要记 ...

  8. TimeSeriesEditor时间序列编辑软件之实战ReoGrid表格控件和Zedgraph绘图控件

    最近用ReoGrid表格控件和Zedgraph绘图控件写了一个TimeSeriesEditor时间序列编辑软件,如下图. 目的就是体验一下这两个空间的用法,感觉还是挺好用的, 关于软件的使用说明可以访 ...

  9. HTML5中改变了哪些东西?

    HTML5 推出的理由 想要把目前web上存在的各种问题一并解决 Web浏览器之间的兼容性很低 文档结构不够明确 Web应用程序的功能受到了限制 HTML5重新定义了浏览器的统一标准 HTML5 与 ...

  10. 2019年5月17日A股暴跌行情思考

    2019年5月17日A股暴跌行情思考 原因:特朗普针对华为的禁商令,人民币对美元汇率大跌 盘面:平开,单边下跌,收盘80多股跌停 操作:下午2点加仓,满仓 总结: 本次操作太过激进. 局势不明朗时抄底 ...