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

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

定位用户的位置

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

<!DOCTYPE html>

<html>

<body>

<p id="demo">点击这个按钮，获得您的坐标：</p>

<button onclick="getLocation()">试一下</button>

<script>

var x=document.getElementById("demo");

function getLocation()

  {

  if (navigator.geolocation)

    {

    navigator.geolocation.getCurrentPosition(showPosition);

    }

  else{x.innerHTML="Geolocation is not supported by this browser.";}

  }

function showPosition(position)

  {

  x.innerHTML="Latitude: " + position.coords.latitude +

  "<br />Longitude: " + position.coords.longitude;

  }

</script>

</body>

</html>

说明：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. 如何建立一个“绑定友好的”usercontrol--wpf

    如何建立一个"绑定友好的"usercontrol--wpf 这几天在打算将以前用winform写的工具程序重构到wpf,顺便学习理解看过的wpf的知识. 因为程序设计到一个Exce ...

  2. PHP连接局域网MYSQL数据库的简单实例

    PHP连接局域网MYSQL数据库的简单实例 [php] view plaincopy <?PHP /** * php连接mysql数据库 * by www.jbxue.com */ $conn= ...

  3. 关于yum与源码安装的LAMP或LNMP网页直接显示空白页的问题？

    学习LAMP.LNMP时,遇到很奇怪的问题就是:搭建完LAMP或LNMP环境后安装PHPweb程序时,Discuz和Wordpress打不开安装向导,直接显示空白页(PHPWind9.0除外),没有任 ...

  4. Python学习_数据排序方法

    Python对数据排序又两种方法: 1. 原地排序:采用sort()方法,按照指定的顺序排列数据后用排序后的数据替换原来的数据(原来的顺序丢失),如: >>> data1=[4,2, ...

  5. Windows Service 访问远程共享权限设置

    最近为实现共享目录之间的文件同步,开发了一个Windows Service. 考虑到在拷贝过程中,如果网络忽然抽风访问不了,导致文件拷贝不完整的情况,果断抛弃.Net 自带的 COPY 方法,而使用D ...

  6. esp8266的STM32驱动

    esp8266的STM32驱动,数据发送接收由DMA完成,释放CPU. 目前只能发送返回消息为成功或失败的AT命令,并判断是否成功,详见esp8266_cmd():其它返回消息不可预知的命令(如查看A ...

  7. OFBIZ bug_ControlServlet.java:233:ERROR

    错误日志: [java] 2014-09-26 10:12:17,031 (http-bio-0.0.0.0-8443-exec-5) [ ControlServlet.java:233:ERROR] ...

  8. Redhat 显示系统版本号和内核版本号

    1./etc/issue 和 /etc/redhat-release都是系统安装时默认的发行版本信息,通常安装好系统后文件内容不会发生变化.[root@rac1 mysql]# cat /etc/is ...

  9. linux whereis which

    whereis 命令只能用于程序名的搜索,而且只搜索二进制文件(参数-b).man说明文件(参数-m)和源代码文件(参数-s). [root@localhost ~]# whereis svn svn ...

  10. java第五课：方法

    方法交换位置的三个步骤:1.把第一个盒子里的东西拿出来,放到一边2.把第二个盒子里的东西放到第一个盒子里3.捡起刚刚放到一边的东西,放到第二个盒子里 值传递:实际参数将内部保存的值,复制给方法的参数. ...