<script type="text/javascript">
function Location() {};

Location.prototype.getLocation = function (callback) {
var options = {
enableHighAccuracy: true,
maximumAge: 1000
};
this.callback = Object.prototype.toString.call(callback) == "[object Function]" ?
callback :
function (address) {
alert(address.province + address.city);
console.log("getocation(callbackFunction) 可获得定位信息对象");
};
var self = this;
if (navigator.geolocation) {
//浏览器支持geolocation
navigator.geolocation.getCurrentPosition(function (position) {
//经度
var longitude = position.coords.longitude;
//纬度
var latitude = position.coords.latitude;
self.loadMapApi(longitude, latitude);
}, self.onError, options);
} else {
//浏览器不支持geolocation
}
};

Location.prototype.loadMapApi = function (longitude, latitude) {
var self = this;
var oHead = document.getElementsByTagName('HEAD').item(0);
var oScript = document.createElement("script");
oScript.type = "text/javascript";
oScript.src = "http://api.map.baidu.com/getscript?v=2.0&ak=A396783ee700cfdb9ba1df281ce36862&services=&t=20140930184510";
oHead.appendChild(oScript);
oScript.onload = function (date) {
var point = new BMap.Point(longitude, latitude);
var gc = new BMap.Geocoder();
gc.getLocation(point, function (rs) {
var addComp = rs.addressComponents;
self.callback(addComp);
});
}
};

Location.prototype.onError = function (error) {
switch (error.code) {
case 1:
alert("位置服务被拒绝");
break;
case 2:
alert("暂时获取不到位置信息");
break;
case 3:
alert("获取信息超时");
break;
case 4:
alert("未知错误");
break;
}
};

//调用
var local = new Location();
local.getLocation(function (res) {
//此处就是返回的地理位置信息
console.log(res);
//JSON.stringify(res),把返回的对象转为字符串了,自己根据需求截取下就好
var resstr = JSON.stringify(res);
alert(resstr);
});
</script>

原生js获取手机定位信息的更多相关文章

  1. Android 获取手机信息,设置权限,申请权限,查询联系人,获取手机定位信息

    Android 获取手机信息,设置权限,申请权限,查询联系人,获取手机定位信息 本文目录: 获取手机信息 设置权限 申请权限 查询联系人 获取手机定位信息 调用高德地图,设置显示2个坐标点的位置,以及 ...

  2. 原生js获取元素的样式信息

    工作中经常会需要获取DOM元素的样式,之前都是通过jquery的css()方法,现在总结一下通过原生js获取元素样式的方法. obj.style js var _width = obj.style.w ...

  3. Expo大作战(三十九)--expo sdk api之 DocumentPicker,Contacts(获取手机联系人信息),Branch

    简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...

  4. 原生 JS 实现手机验证码倒计时

    可以使用 pointer-events 来阻止元素成为鼠标事件的 target.html5 新增操作元素 class 类名的方式 classList. classList 方法 add(value): ...

  5. [微信小程序] 微信小程序获取用户定位信息并加载对应城市信息,wx.getLocation,腾讯地图小程序api,微信小程序经纬度逆解析地理信息

    因为需要在小程序加个定位并加载对应城市信息 然而小程序自带api目前只能获取经纬度不能逆解析,虽然自己解析方式,但是同时也要调用地图,难道用户每次进小程序还要强行打开地图选择地址才定位吗?多麻烦也不利 ...

  6. 前端通过js获取手机型号

    ###前段通过js获取手机型号 需求: 用户登录后记录当前的手机型号并记录 插件: mobile-detect.js插件地址 mobile-device-js插件地址 使用步骤: 获取UA信息-> ...

  7. JS获取手机型号和系统

    废话不多说,直接上源码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type&q ...

  8. 原生js获取鼠标坐标方法全面讲解-zmq

    原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...

  9. 兼容各版本浏览器,封装原生Js获取ClassName

    web前端开发工作中常常会用到获取元素的className,用jQuery的$(".class")方法也可以获取className,但是有时候牵扯到数据而影响的加载顺序的原因会获取 ...

随机推荐

  1. JDBC_事务概念_ACID特点_隔离级别_提交commit_回滚rollback

    事务的概念 一组要么同时执行成功,要么同时执行失败的SQL语句,是数据库操作的一个执行单元! 事务开始于: 连接到数据库上,并执行一条DML语句(insert,update或delete),前一个事务 ...

  2. External Tools

    Preferences偏好设置-External Tools External Tools: External Script Editor:外部脚本编辑器,通过此项可以切换您所擅用的脚本的编辑器 Ed ...

  3. 【算法笔记】B1028 人口普查

    1028 人口普查 (20 分) 某城镇进行人口普查,得到了全体居民的生日.现请你写个程序,找出镇上最年长和最年轻的人. 这里确保每个输入的日期都是合法的,但不一定是合理的——假设已知镇上没有超过 2 ...

  4. P1353_[USACO08JAN]跑步Running 我死了。。。

    我死了...被绿题虐...看来我的水平有待提高...QWQ 好吧,就是跑步的时候只能从跑步的状态转移过来 休息的时候可以从上一次休息时转移过来,也可以从某次跑步的时转移过来,需要枚举从哪一个状态转移来 ...

  5. BZOJ - 1458 / P4311 最大流应用 贪心

    题意:给定n*m的图,每个士兵可以占领当前行和列,第i行至少要R[i]个士兵占领,第j列至少要C[j]个士兵占领,部分网格无法占领,求占领所用最少士兵数,若无解则输出orz 士兵的贡献情况有1(只有效 ...

  6. [转] #!/bin/sh & #!/bin/bash区别

    [From] http://blog.51cto.com/meiling/1826201 在shell脚本的开头往往有一句话来定义使用哪种sh解释器来解释脚本.目前研发送测的shell脚本中主要有以下 ...

  7. Oracle SET UNUSED的用法

    SET UNUSED的用法 原理:清楚掉字典信息(撤消存储空间),不可恢复.    可以使用 SET UNUSED选项标记一列或者多列不可用.    使用DROP SET UNUSED选项删除被被标记 ...

  8. 使用Maven运行Java main的3种方式使用Maven运行Java main的3种方式

    maven使用exec插件运行java main方法,以下是3种不同的操作方式. 一.从命令行运行 1.运行前先编译代码,exec:java不会自动编译代码,你需要手动执行mvn compile来完成 ...

  9. spark第六篇:Spark Streaming Programming Guide

    预览 Spark Streaming是Spark核心API的扩展,支持高扩展,高吞吐量,实时数据流的容错流处理.数据可以从Kafka,Flume或TCP socket等许多来源获取,并且可以使用复杂的 ...

  10. Oracle 单实例数据库安装和real application clusters数据库安装的区别

    在想了解Oracle单实例数据可和RAC数据库前,请确保你已经知道了数据库和实例的关系,如果不了解,请参考Oracle 数据库实例和数据库. 单实例数据库模式 单实例模式下,一个数据库只能通过一个实例 ...