参考教程：http://www.w3school.com.cn/html5/html_5_geolocation.asp

说明:设备必须有GPS定位功能才能定位的

定位用户的位置

HTML5 Geolocation API 用于获得用户的地理位置。

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  4. <p id="demo">点击这个按钮，获得您的坐标：</p>
  5. <button onclick="getLocation()">试一下</button>
  6. <script>
  7. var x=document.getElementById("demo");
  8. function getLocation()
  9.   {
  10.   if (navigator.geolocation)
  11.     {
  12.     navigator.geolocation.getCurrentPosition(showPosition);
  13.     }
  14.   else{x.innerHTML="Geolocation is not supported by this browser.";}
  15.   }
  16. function showPosition(position)
  17.   {
  18.   x.innerHTML="Latitude: " + position.coords.latitude +
  19.   "<br />Longitude: " + position.coords.longitude;
  20.   }
  21. </script>
  22. </body>
  23. </html>
  24.  
  25. 说明：html5的定位还比较准，我在Android与iphone上都有测试过，另外这种定位方式也比较简单

HTML5学习(七)----地理定位的更多相关文章

  1. HTML5 学习之地理定位

    html5 获取坐标: <!DOCTYPE HTML> <html> <head> <title>test1.html</title> &l ...

  2. HTML5 Geolocation API地理定位整理（二）

    Geolocation 实例demo 1.使用watchPosition()监听客户端位置 var watchOne=null; if (navigator.geolocation) { //watc ...

  3. HTML5 Geolocation API地理定位整理（一）

    HTML5 Geolocation API 用于获得用户的地理位置. 鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的. 浏览器支持 Internet Explorer 9+, ...

  4. HTML5: HTML5 Geolocation（地理定位）

    ylbtech-HTML5: HTML5 Geolocation(地理定位) 1.返回顶部 1. HTML5 Geolocation(地理定位) HTML5 Geolocation(地理定位)用于定位 ...

  5. HTML5 Geolocation（地理定位）

    一.背景 在HTML规范中,增加了获取用户地理信息的API,这样使得可以基于用户位置开发互联网应用,即基于位置服务 鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的. Inter ...

  6. HTML5学习总结-03 地理定位

    一 地理定位 HTML5 Geolocation(地理定位)用于定位用户的位置. 1 地理定位 地理位置 经度  :   南北极的连接线 纬度  :   东西连接的线 位置信息从何而来: IP地址 G ...

  7. HTML5 学习06——Geolocation（地理定位）

    HTML5 Geolocation(地理定位) HTML5 Geolocation API 用于获得用户的地理位置. 鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的. HTML ...

  8. HTML5学习笔记 Geolocation（地理定位）

    HTML5 Geolocation(地理定位)用于定位用户的位置. 定位用户的位置 html5 Geolocation API用于获得用户的地理位置 鉴于该特性可能低侵犯用户的隐私,除非用户同意,否则 ...

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

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

随机推荐

  1. dtcms,header显示头像和用户名,QQ互联老不通过的解决方法

    http://bbs.dtsoft.net/forum.php?mod=viewthread&tid=1742&extra=page%3D1

  2. FileStream使用小记

    流用于对IO处理 在System.IO名称空间中有以下类 BinaryReader/Writer TextReader/Writer Stream 其中类Stream为抽象类.由此有三个派生类: Me ...

  3. 用AJAX自定义日历

    需求分析 在一些购物网站中,都会有促销活动,这些活动都在日历上标注出来,如何通过Ajax让日历 通过读取数据库中的信息,正确的把促销活动标注在日历上,本文通过自定义日历来实现这 个问题. 技术难点 日 ...

  4. VB 核心编程及通用模块开发 笔记1

    前言:学习任何编程语言.编程工具的目的不外乎解决生活问题,能够快速.高效解决问题的方式就是不错的方式,至于选择什么“工具”,众位看官看着办,本人虽然有过3年vb开发经验,但是一直没有深入学习,现已购买 ...

  5. C/C++错误分析errno,perror,strerror和GetLastError()函数返回的错误代码的意义

    在C语言编译中,经常会出现一些系统的错误,这些错误如果在编译的时候不能很好的“预见”,会使系统“崩溃”,常见的捕获错误函数有: errno #include<errno.h> 这个变量是程 ...

  6. 找不到 com.google.zxing.ResultMetadataType 异常解决

    在 https://github.com/zxing/zxing 下载二维码扫描 将 android 导入,code打成jar包运行时 报 06-14 23:43:08.690: E/AndroidR ...

  7. Oracle外部表的使用

    外部表可以像其它表一样,用select语句作查询.但不能做DML操作,不能建index,不接受约束.这是因为它不是以段的形式存于数据库中,只是以数据字典构造存在,指向一个或多个操作系统文件. 外部表的 ...

  8. FormBorderStyle.None 时候最大化不遮盖任务栏

    this.FormBorderStyle = FormBorderStyle.None;             this.MaximumSize = new Size(Screen.PrimaryS ...

  9. CROSS APPLY和 OUTER APPLY 区别

    转 http://www.cnblogs.com/end/archive/2011/02/17/1957011.html FROM employees AS e       join employee ...

  10. 2329: [HNOI2011]括号修复 - BZOJ

    恶心的splay,打标记的时候还有冲突,要特别小心 上次写完了,查了半天没查出错来,于是放弃 今天对着标程打代码,终于抄完了,我已经不想再写了 const maxn=; type node=recor ...