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

<!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. 使用create-react-app时的something is already running on port 3000

    问题: 自己今天在使用create-react-app搭建react应用的时候,开启了两个React app,然后npm start的时候,出现something is already running ...

  2. Ubuntu中APache+mod_pyhon

    安装apache 1.sudo apt-get install Apache2 Apxs(Apache extension tool既apache扩展模块的工具)的安装: 1.sudo apt-get ...

  3. Flash＆Flex大全

    官方在线帮助(没标英文的都是中文) 用于 Adobe Flash Platform 的 ActionScript 3.0 参考 更多参考使这样的链接下载离线版:http://help.adobe.co ...

  4. es6数组去重复

    var arr=[1,1,2,3,5,7,7,7] arr=Array.from(new Set(arr))

  5. Julia：高性能 GPU 计算的编程语言

    Julia:高性能 GPU 计算的编程语言 0条评论 2017-10-31 18:02    it168网站 原创 作者: 编译|田晓旭 编辑: 田晓旭 [IT168 评论]Julia是一种用于数学计 ...

  6. unity stuck when building

    卡在 packaging assets 这里的话 把文件夹只读属性去掉 应用于子文件夹

  7. conkey conf

    update_interval 1.0 # 更新时间间隔double_buffer yes # 双缓存,解决Conky闪烁问题use_xft yes # 自定义字体xftfont DejaVu San ...

  8. 小凡带你搭建本地的光盘yum源

    小凡带你搭建本地的光盘yum源 导读 当我们在使用Yum工具安装软件包时,我们会感觉非常简单,它解决了一定程度软件包的依赖关系.但是Yum工具默认提供的是一种在线安装的方式,它会从默认的网上地址来寻找 ...

  9. 绿化和卸载 DOS 批处理

    @ECHO OFF&PUSHD %~DP0 &TITLE 绿化和选项 mode con cols= lines= color 2F Rd >NUL Md >NUL||(Ec ...

  10. 深入分析JavaWeb Item24 -- jsp2.X自己定义标签开发进阶

    一.简单标签(SimpleTag) 由于传统标签使用三个标签接口来完毕不同的功能,显得过于繁琐.不利于标签技术的推广, SUN公司为减少标签技术的学习难度,在JSP 2.0中定义了一个更为简单.便于编 ...