获取地理位置的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 ...
随机推荐
- Unbutu网卡驱动安装(Intel内置网卡8086:15b8)
工作中需要在新的实验平台上安装unbuntu14.04操作系统,系统安装好之后发现无法连接网络,分析后是由于缺少网卡驱动的原因. 下面把分析问题的过程及安装网卡驱动步骤介绍如下: 查看PCI信息 su ...
- 12306验证图片的bug
刚才有人告诉我12306验证码换了,于是我就打开了看了看,点了点.oh no , i am really sorry ,12306.
- MapReduce的执行过程.
作业在运行时,数据或者是作业调用的一个运行图. 用户写的代码通过JobClient提交给JobTracker Job对象中封装了JobClient JobConf和我们的Job对象几乎是一回事. 把我 ...
- 使用logback.xml配置来实现日志文件输出
转自:http://sungang-1120.iteye.com/blog/2104296 Logback是由log4j创始人设计的又一个开源日志组件.logback当前分成三个模块:logback- ...
- CDH5.5.1 安装Spark ON Yarn环境
CDH对我们已经封装了,我们如果需要Spark on Yarn,只需要yum安装几个包就可以了. 前面的文章我有写过如果搭建自己内网的CDH Yum服务器,请参考<CDH 5.5.1 Yum源服 ...
- openstack【Kilo】汇总:包括20英文文档、各个组件新增功能及Kilo版部署
OpenStack Kilo版本发布 20英文文档OpenStack Kilo版本文档汇总:各个操作系统安装部署.配置文档.用户指南等文档 Kilo版部署 openstack[Kilo]入门 [准备篇 ...
- Stunnix C++ Obfuscator使用简介
因为项目的需求,需要混淆C代码.目前.net和java混淆工具很好用.但是c混淆工具不多.找到一个Stunnix C++ Obfuscator http://www.stunnix.com/网上很少有 ...
- Test Spring el with ExpressionParser
Spring expression language (SpEL) supports many functionality, and you can test those expression fea ...
- 定义文档兼容性,让IE按指定的版本解析我们的页面
作为开发人员,特别是作为Web的前端开发人员 ,最悲催的莫过于要不断的,不断的去调试各种浏览器的显示效果,而这其中最让人头痛的莫过于MS下的IE系列浏览器,在IE系列中的调试我们将会发现没有一个是好伺 ...
- 部署WEB应用程序
部署WEB应用程序: 1.在模板机上新建IIS站点 2.安装WebDeploy后在IIS控制台中导出站点为应用程序包 其站点在新虚机上必须存在,否则会报错,如下: 应用程序(C:\ProgramDat ...