<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
/**
* 地理定位
*
* navigator ˈnævɪgeɪtə(r) (兰微给特) n. 领航员
* navigator是在JavaScript中的一个独立的对象,他用于提供用户所使用的浏览器以及操作系统等信息,以navigator对象属性的形式来提供
*
* Navigator 对象包含有关浏览器的信息。
* 注释:没有应用于 navigator 对象的公开标准,不过所有浏览器都支持该对象
*/
function getLocation() { //判断浏览器是否支持html5地理定位
//地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用
if (navigator.geolocation) { //定位方法,参数1:定位成功回调函数,参数2:定位失败回调函数,参数3:具体定位设置
navigator.geolocation.getCurrentPosition(showMap,handlerError,{
enableHighAccuracy:true, //是否高精度定位
maximumAge:1000 //每隔多少毫秒重新获得一次位置
}); } else {
alert('当前浏览器不支持html5的地理定位');
}
} /**
* 定位成功的回调函数,参数就是坐标对象
*/
function showMap(loc) { var longitude = loc.coords.longitude;//经度
var latitude = loc.coords.latitude;//纬度 alert('定位成功,当前经纬度:' + longitude + ',' + latitude);
} /**
* 定位失败的回调函数,参数就是错误码对象
*/
function handlerError(err) { if (err.code == 1) {
alert('位置服务被拒绝,请开启');
} else if (err.code == 2) {
alert('无法获得用户位置');
} else if (err.code == 3) {
alert('获取信息超时');
} else if (err.code == 4) {
alert('未知错误无法定位');
}
} //调用定位
getLocation();
</script> </body>
</html>

  

h5-22-地理位置的更多相关文章

  1. H5 获取地理位置

    只能通过手机浏览器访问,并且用户必须允许访问才可以生效 <!doctype html> <html> <head> <title>Mobile Cook ...

  2. H5系列之地理位置(必知必会)

    H5之地理位置必知必会     [02]概念   规范地址:http://www.w3.org/TR/geolocation-API/     HTML5 Geolocation(地理定位)用于定位用 ...

  3. H5 Notes:Navigator Geolocation

    H5的地理位置API可以帮助我们来获取用户的地理位置,经纬度.海拔等,因此我们可以利用该API做天气应用.地图服务等. Geolocation对象是我们获取地理位置用到的对象. 首先判断浏览器是否支持 ...

  4. Android WebView 详解

    相关API 相关类介绍 WebResourceRequest 添加于API21,封装了一个Web资源的请求信息,包含:请求地址,请求方法,请求头,是否主框架,是否用户点击,是否重定向 WebResou ...

  5. div需要重置吗?

    看看所有常用标签的默认margin.padding?Demo戳这里 - - 当你每次看到为那一长串标签设置margin: 0; padding: 0; 的时候,你是否想看看哪些标签,在哪些浏览器里有默 ...

  6. 解决window.navigator.geolocation.getCurrentPosition在IOS10系统中无法进行地理定位问题

    昨天接到用户通知说在点击"看场地"时无法获取地理位置信息. 在接到通知时,首先想到的是排查机型问题.由于客户多为IOS用户,所以最先看的是在安卓是有没有此问题的发生,调查结果为安卓 ...

  7. 实现websocket

    转:http://www.cnblogs.com/dolphinX/p/3462898.html 在之前的博客中提到过看到html5 的websocket后很感兴趣,终于可以摆脱长轮询(websock ...

  8. 07. Web大前端时代之:HTML5+CSS3入门系列~H5 地理位置

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 源码:https://github.com/duniti ...

  9. h5地理位置API

    h5地理位置API 地理API允许javascript程序向浏览器询问用户的真实地理位置,支持地理位置API的浏览器在访问前总是会询问用户是否允许. 获取用户地理的途径有:         1.ip地 ...

  10. 获取定位,苹果IOS10以上不支持h5的geolocation获取不到地理位置信息解决办法

    今天开发应用,获取地理位置,最先采用H5的Geolocation的方法来获取地理位置,经过测试发现安卓的机子可以,但是IOS的就是不行,一查资料才知道:10.0苹果版本需要协议为https的才可以获取 ...

随机推荐

  1. 2017 Multi-University Training Contest - Team 1 (5/12)

    官方题解 1001. Add More Zero #pragma comment(linker, "/STACK:1024000000,1024000000") #include& ...

  2. liberOJ #6173. Samjia 和矩阵 hash+后缀数组

    #6173. Samjia 和矩阵 题目链接  : 点这里 题目描述 给你一个只包含大写字母的矩阵,求有多少本质不同的子矩阵. 输入格式 第一行包含两个整数 nnn , mmm ,表示矩阵 nnn 行 ...

  3. 通过命令打包apk

    平时使用android studio打包,方便快捷,对命令不太熟悉,但在上传apk包到应用市场时,需要认领apk,“认领页的[选择APK]”不是上传您要更新的APK应用文件,而是下载我们提供的空包文件 ...

  4. poj 1742 Coins(二进制拆分+bitset优化多重背包)

    \(Coins\) \(solution:\) 这道题很短,开门见山,很明显的告诉了读者这是一道多重背包.但是这道题的数据范围很不友好,它不允许我们直接将这一题当做01背包去做.于是我们得想一想优化. ...

  5. 星星dom

    <!DOCTYPE html><html><head><meta charset="UTF-8"><title>星星&l ...

  6. MYSQL进阶学习笔记二:MySQL存储过程和局部变量!(视频序号:进阶_4-6)

    知识点三:MySQL存储过程和局部变量(4,5,6) 存储过程的创建:     创建存储过程的步骤: 首先选中数据库 改变分隔符,不让分号作为执行结束的标记.(通常情况下,改变分隔符命令 DELIMI ...

  7. linux初级学习笔记一:linux操作系统及常用命令,及如何获取命令的使用帮助!(视频序号:02_1,2)

    本节学习的命令:ls,cd,type,pwd, printenv, hash, date, clock, man, hwclock, info, cal, echo, printf, file! 本节 ...

  8. JQuery树形插件Dynatree的包装对象

    这是JQuery Dynatree插件的包装对象,做了些改进和增强,增加了右键菜单,以及相应事件等扩展1. [代码]MagicDTree的基本使用 <SCRIPT type=text/javas ...

  9. html5--6-8 CSS选择器5

    html5--6-8 CSS选择器5 实例 <!DOCTYPE html> <html lang="zh-cn"> <head> <met ...

  10. UVA140 剪枝

    题目 分析:这个题的数据范围很小,直接打印全排列去判断也能过,但是这里存在两个剪枝,第一个,如果当前的距离已经大于前面距离的最小值,则剪枝,还有一个就是如果与当前结点相连的边数大于等于前面距离的最小值 ...