只能通过手机浏览器访问，并且用户必须允许访问才可以生效

<!doctype html>

<html>

  <head>

        <title>Mobile Cookbook</title>

        <meta charset="utf-8">

        <meta name="viewport" content="width=device-width, initial-scale=1.0">

  </head>

  <body>

    <header>

    </header>

        <div id="main">

            <div id="someElm">

            </div>

        </div>

    <footer>

    </footer>

    <script src="https://cdn.bootcss.com/jquery/1.9.1/jquery.min.js"></script>

    <script>

    function getLocation() {

    navigator.geolocation.getCurrentPosition(showInfo);

  }

  function showInfo(position) {

      console.log(position);

    var latitude = position.coords.latitude;

    var longitude = position.coords.longitude;

    var accuracy = position.coords.accuracy;

    $('#someElm').html('latitude: '+latitude+'<br />longitude: '+longitude+'<br />accuracy: '+accuracy);

  }

  getLocation();

    </script>

    </body>

</html>

H5 获取地理位置的更多相关文章

  1. Html5 Geolocation获取地理位置信息

    Html5中提供了地理位置信息的API,通过浏览器来获取用户当前位置.基于此特性可以开发基于位置的服务应用.在获取地理位置信息前,首先浏览器都会向用户询问是否愿意共享其位置信息,待用户同意后才能使用. ...

  2. html5实现获取地理位置信息并定位

    这里主要讲h5实现获取地理位置信息并定位功能,本文讲解了原生h5,百度地图,谷歌地图等三种获取地理信息并定位的方法,需要的朋友可以参考下: h5提供了地理位置功能(Geolocation API),能 ...

  3. Html5 Geolocation获取地理位置信息(转)

    Html5中提供了地理位置信息的API,通过浏览器来获取用户当前位置.基于此特性可以开发基于位置的服务应用.在获取地理位置信息前,首先浏览器都会向用户询问是否愿意共享其位置信息,待用户同意后才能使用. ...

  4. h5获取地理坐标

    h5获取地理坐标 方法:h5自带获取地理信息的api api:navigator.geolocation.getCurrentPosition https://developer.mozilla.or ...

  5. HTML5 获取地理位置信息

    HTML5增加的新功能,获取地理位置信息,如果浏览器支持且设备有定位功能,就能够直接使用这组API来获取当前信息位置.该Geolocation API可以应用于移动设备中的地理位置. Geolocat ...

  6. HTML5获取地理位置

    包含了以下功能:(1)通过IP地址获取城市地址(并不完全准确,存在代理IP或IP中转时定位与实际位置不一致的情况)(2)通过移动端浏览器及GPS定位位置坐标(3)根据位置坐标转换百度地图坐标(4)根据 ...

  7. html5代码,获取地理位置

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <meta htt ...

  8. paip.获取地理位置根据Ip

    paip.获取地理位置根据Ip html转换txt 正则表达式截取mid 作者Attilax  艾龙, EMAIL:1466519819@qq.com 来源:attilax的专栏 地址:http:// ...

  9. Android 获取地理位置的经度和纬度(zz)

    在Android应用程序中,可以使用LocationManager来获取移动设备所在的地理位置信息.看如下实例:新建android应用程序TestLocation. 1.activity_main.x ...

随机推荐

  1. bootstrap学习（全局CSS样式）（二）

    标题类:.h1到.h6 页面主体 bootstrap将全局font-size设置为14px,line-height设置为1.428,这些属性 直接赋予元素和所有段落元素. 文本对齐类 text-lef ...

  2. Java操作excel表格

    (1)Java读取excel表格 package com.songyan.excel; import java.io.File; import java.io.FileInputStream; imp ...

  3. Android工具：Hierarchy Viewer

    Hierarchy Viewer 用途: 即可以用来优化自己的布局,也可以用来参考别人优秀的布局 打开方式: 运行工程,然后在\android-sdk-windows\tools目录下双击hierar ...

  4. GridControl事件

    private void gridView1_RowCellClick(object sender, DevExpress.XtraGrid.Views.Grid.RowCellClickEventA ...

  5. 修改activityMQ的登录账与密码

    登录下管理员页面,ip根据实际的来 URL : http://127.0.0.1:8161/admin/ 默认账户密码都是admin 账户密码修改在conf文件夹下的jetty-realm.prope ...

  6. Ubuntu下Wine使用教程

    转自:http://blog.csdn.net/wangchangshuai0010/article/details/12057251 用了段时间的Ubuntu,感觉很好!可是工作的时候还是要用到 w ...

  7. JS跳转页面的几种方法

    JS的几种跳转方式: 1. window.open(”url“) 2.用自定义函数 <script> function openWin(tag,obj) { obj.target=&quo ...

  8. 一个简单好用的zabbix告警信息发送工具

    之前使用邮件和短信发送zabbix告警信息,但告警信息无法实时查看或者无法发送,故障无法及时通知运维人员. 后来使用第三方微信接口发送信息,愉快地用了一年多,突然收费了. zabbix告警一直是我的痛 ...

  9. SQL性能调优基础教材

    一.数据库体系结构 1.       Oracle数据库和实例 数据库:物理操作系统文件或磁盘的集合. 实例:一组Oracle后台进程/线程以及一个共享内存区,这些内存由同一个计算机上运行的线程/进程 ...

  10. android wifi调试(无线调试) 一步到位

    没有数据线时候,怎么进行调试开发?只要在一个局域网内,最好选择wifi调试! 网上有很多这样的教程,但是有很多步.很繁琐.最近我在gp上下载了一个软件可以实现点击一步就可以了.不需要在手机上输入任何命 ...