获取地理位置的html5代码
- /**
- * 以下为html5代码,获取地理位置
- */
- function getLocation() {
- //检查浏览器是否支持地理位置获取
- if (navigator.geolocation) {
- //若支持地理位置获取,成功调用showPosition(),失败调用showError
- // alert("正在努力获取位置...");
- var config = { enableHighAccuracy: true, timeout: 5000, maximumAge: 30000 };
- navigator.geolocation.getCurrentPosition(showPosition, showError, config);
- } else {
- //alert("Geolocation is not supported by this browser.");
- alert("定位失败,用户已禁用位置获取权限");
- }
- }
- /**
- * 获取地址位置成功
- */
- function showPosition(position) {
- //获得经度纬度
- var x = position.coords.latitude;
- var y = position.coords.longitude;
- //配置Baidu Geocoding API
- var url = "http://api.map.baidu.com/geocoder/v2/?ak=C93b5178d7a8ebdb830b9b557abce78b" +
- "&callback=renderReverse" +
- "&location=" + x + "," + y +
- "&output=json" +
- "&pois=0";
- $.ajax({
- type: "GET",
- dataType: "jsonp",
- url: url,
- success: function (json) {
- if (json == null || typeof (json) == "undefined") {
- return;
- }
- if (json.status != "0") {
- return;
- }
- setAddress(json.result.addressComponent);
- },
- error: function (XMLHttpRequest, textStatus, errorThrown) {
- alert("[x:" + x + ",y:" + y + "]地址位置获取失败,请手动选择地址");
- }
- });
- }
- /**
- * 获取地址位置失败[暂不处理]
- */
- function showError(error) {
- switch (error.code) {
- case error.PERMISSION_DENIED:
- alert("定位失败,用户拒绝请求地理定位");
- //x.innerHTML = "User denied the request for Geolocation.[用户拒绝请求地理定位]"
- break;
- case error.POSITION_UNAVAILABLE:
- alert("定位失败,位置信息是不可用");
- //x.innerHTML = "Location information is unavailable.[位置信息是不可用]"
- break;
- case error.TIMEOUT:
- alert("定位失败,请求获取用户位置超时");
- //x.innerHTML = "The request to get user location timed out.[请求获取用户位置超时]"
- break;
- case error.UNKNOWN_ERROR:
- alert("定位失败,定位系统失效");
- //x.innerHTML = "An unknown error occurred.[未知错误]"
- break;
- }
- }
- /**
- * 设置地址
- */
- function setAddress(json) {
- var position = document.getElementById("txtPosition");
- //省
- var province = json.province;
- //市
- var city = json.city;
- //区
- var district = json.district;
- province = province.replace('市', '');
- position.value = province + "," + city + "," + district;
- position.style.color = 'black';
- }
获取地理位置的html5代码的更多相关文章
- 微信公众平台网页开发实战--3.利用JSSDK在网页中获取地理位置(HTML5+jQuery)
复制一份JSSDK环境,创建一份index.html文件,结构如图7.1所示. 图7.1 7.1节文件结构 在location.js中,封装“getLocation”接口,如下: 01 wxJSSD ...
- html5代码,获取地理位置
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <meta htt ...
- Html5 Geolocation获取地理位置信息
Html5中提供了地理位置信息的API,通过浏览器来获取用户当前位置.基于此特性可以开发基于位置的服务应用.在获取地理位置信息前,首先浏览器都会向用户询问是否愿意共享其位置信息,待用户同意后才能使用. ...
- AngularJS进阶(二十)HTML5实现获取地理位置信息并定位功能
HTML5实现获取地理位置信息并定位功能 注:请点击此处进行充电! 前言 这篇文章主要介绍了HTML5实现获取地理位置信息并定位功能,本文讲解了原生HTML5.百度地图.谷歌地图等三种获取理位置信息并 ...
- html5实现获取地理位置信息并定位
这里主要讲h5实现获取地理位置信息并定位功能,本文讲解了原生h5,百度地图,谷歌地图等三种获取地理信息并定位的方法,需要的朋友可以参考下: h5提供了地理位置功能(Geolocation API),能 ...
- html5获取地理位置信息API
html5获取地理位置信息API 在HTML5中,可以看下如何使用Geolocation API来获得用户的地理位置信息,如果该浏览器支持的话,且设备具有定位功能,就能够直接使用这组API来获取当前位 ...
- Html5 Geolocation获取地理位置信息(转)
Html5中提供了地理位置信息的API,通过浏览器来获取用户当前位置.基于此特性可以开发基于位置的服务应用.在获取地理位置信息前,首先浏览器都会向用户询问是否愿意共享其位置信息,待用户同意后才能使用. ...
- HTML5实现获取地理位置信息并定位功能
HTML5提供了地理位置定位功能(Geolocation API),能确定用户位置,我们可以借助HTML5的该特性开发基于地理位置信息的应用.本文结合实例给大家分享如何使用HTML5,借助百度.谷歌地 ...
- HTML5 获取地理位置信息
HTML5增加的新功能,获取地理位置信息,如果浏览器支持且设备有定位功能,就能够直接使用这组API来获取当前信息位置.该Geolocation API可以应用于移动设备中的地理位置. Geolocat ...
随机推荐
- svn跳过某个目录
svn up --set-depth exclude dir2 http://stackoverflow.com/questions/1439176/svn-can-you-remove-direct ...
- struts2实现文件上传
Struts2中实现简单的文件上传功能: 第一步:将如下文件引入到WEB_INF/lib目录下面,对应的jar文件可自行下载 第二步:在包test.struts2下建立类UploadFile pack ...
- google proto buffer安装和简单示例
1.安装 下载google proto buff. 解压下载的包,并且阅读README.txt,根据里面的指引进行安装. $ ./configure $ make $ make check $ mak ...
- homework-01 "最大子数组之和"的问题求解过程
写在前面:我的算法能力很弱,并且也是第一次写博文,总之希望自己能在这次的课程中学到很多贴近实践的东西吧. 1.这次的程序是python写的,这也算是我第一次正正经经地拿python来写东西,结果上来说 ...
- JavaFX 2 Dialogs
http://edu.makery.ch/blog/2012/10/30/javafx-2-dialogs/ ———————————————————————————————————————————— ...
- [iOS基础控件 - 6.9.3] QQ好友列表Demo TableView
A.需求 1.使用plist数据,展示类似QQ好友列表的分组.组内成员显示缩进功能 2.组名使用Header,展示箭头图标.组名.组内人数和上线人数 3.点击组名,伸展.缩回好友组 code so ...
- PC 端微信扫码注册和登录
一.前言 先声明一下,本文所注重点为实现思路,代码及数据库设计主要为了展现思路,如果对代码效率有着苛刻要求的项目切勿照搬. 相信做过微信开发的人授权这块都没少做过,但是一般来说我们更多的是为移动端的网 ...
- 基于EF的数据外键关联查询
现在很多ORM不自带外键关联的实体查询,比如我查询用户,用时将关联的角色信息查询出来,那么就要进行2次查询,很麻烦.而我现在要做的就是基于EF的外键关联查询.很方便的. 首先,创建基础查询的BaseS ...
- Spring 的两个配置容器的讲解
容器 是Spring框架的核心,是组件存活的地方.Spring容器使用DI管理所有组成应用系统的组件,协作组件之间建立联.而且, 这些对象简洁易懂,降低耦合性,支持重用,容易被测试. Spring提供 ...
- 删除链表中全部值为k的节点
1. 问题描写叙述 给定一个单链表,删除当中值为k的全部节点.比如:1→2→6→3→4→5→61 \to 2 \to 6 \to 3 \to 4 \to 5 \to 6,删除当中值为6的节点,返回:1 ...