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

<!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. UDP和TCP的区别和联系

    UDP特点 将数据源和目的封装在数据包中,不需要简历连接 每个数据报的大小在限制在64K内 因无连接,是不可靠协议 不需要建立连接,速度快 TCP 建立连接.形成传输数据通道. 在连接中进行大量数据量 ...

  2. Notepad++前端开发常用插件介绍

    Notepad++前端开发常用插件介绍 Notepad++除了自身的功能强大之外,更是有许多非常的优秀的插件,下面就总结一下前端开发过程一些比较常用的插件. Emmet Emmet的前身是Zen Co ...

  3. rdlc报表集锦

    rdlc报表动态生成实例 http://blog.csdn.net/fwj380891124/article/details/8803844  rdlc报表动态生成公共类 http://blog.cs ...

  4. JavaScript基础入门教程(四)

    说明 前面三篇博客介绍了js中基本的知识点,包括变量类型及其转换.表达式.运算符等小知识点,这篇博客主要讲的是对象.如果你学过java等语言,你也许在下文的阅读中发现在js中的对象与java中的对象存 ...

  5. 微软浏览器兼容工具modern.IE

    http://www.browserstack.com/screenshots

  6. latex不能识别eps图片

    latex中可以使用.eps的图片,许多文档都介绍了怎么引用这种格式的图片,但没有给出使用过程中的注意事项.我在使用MIKTEX的时候,latex文档中引入.eps图片遇到了这样的问题.编译的时候显示 ...

  7. 如何修改chrome谷歌浏览器的默认搜索引擎

    如图设置,chrome自己提供的百度的引擎,不能用,自己添加一个即可 添加的方法如下:打开百度搜索内容“cai”,然后把搜索的url内容放到上图的网址栏里,并用%s替换“cai”

  8. 字符编码,pyton中的encode,decode,unicode()

    1.在计算机处理的程序中,对字符的处理有两种方式:编码或译码(encoding),解码(decoding)     encoding:将字符串中的字符转换到对应编码字符集对应的代码点         ...

  9. threadlocal 变量 跟synchronized 关键字的关系

    为什么叫threadloca变量呢,经过大量的查资料发现threadlocal并不是之前理解的控制线程用的东西,它其实也属于一类变量,只不过是线程的局部变量,它的作用就是实现线程间对该变量的唯一线程调 ...

  10. SVN-项目 XXX 受源代码管理。向源代码管理注册此项目时出错。建议不要对此项目进行任何修改

    错误描述:  项目 XXX 受源代码管理.向源代码管理注册此项目时出错.建议不要对此项目进行任何修改 解决办法: 使用记事本打开,项目csproj文件删除图中几行,重新打开解决方案就可以了 原因分析: ...