单次定位请求及点击一次只发出一次请求

下面是个获取经纬度的简单Demo

简要截图如下：

简要代码如下：

<!DOCTYPE html>

<html>

<head>

      <meta charset="utf-8">

    <title></title>

</head>

<body>

<input type="button" value="点击获取地理信息" id="btnClick"/><br/>

<textarea style="width:400px;height:400px;border:1px solid blue;" id="t1"></textarea>

</body>

</html>

<script type="text/javascript">

    //基于地理信息的应用

    var btnClick=document.getElementById("btnClick");

    var t1=document.getElementById("t1");

    btnClick.onclick=function(){ //单次定位请求    ，及点击一次请求一次

       navigator.geolocation.getCurrentPosition(function(position){

       t1.value+="经度:"+position.coords.longitude+":纬度:"+position.coords.latitude+"\n";//获取经度信息

       },function(err){  //获得失败编号 0:不包含其它编号中的错 1:用户拒绝浏览器获取位置信息 2.尝试获取用户信息但失败了 3.timeout超时

        alert(err.code);//用户拒绝浏览器获取信息，弹出1

       },{ //数据收集:JSON的形式

            enableHighAcuracy:true, //设置更精确的查找

            timeout:, //设置请求超时的时间为5秒钟

            maximumAge: //设置位置可以缓存的最大时间为5秒钟

       });

    }

</script>

HTML5——单次定位请求的更多相关文章

  1. HTML5——多次定位请求

    多次定位请求及点击一次 就不断的触发请求事件,和单次定位请求写法差不多,只需要将 navigator.geolocation.getCurrentPosition改为navigator.geoloca ...

  2. html5 Geolocation(地理位置定位)学习

    1.html5 Geolocation html5 Geolocation API 使用很简单,请求一个位置信息,如果用户同意,浏览器会返回一个位置信息,该位置是通过用户的底层设备(手机,电脑) 提供 ...

  3. 浅谈HTML5单页面架构（一）——requirejs + angular + angular-route

    心血来潮,打算结合实际开发的经验,浅谈一下HTML5单页面App或网页的架构. 众所周知,现在移动Webapp越来越多,例如天猫.京东.国美这些都是很好的例子.而在Webapp中,又要数单页面架构体验 ...

  4. 浅谈HTML5单页面架构（二）——backbone + requirejs + zepto + underscore

    本文转载自:http://www.cnblogs.com/kenkofox/p/4648472.html 上一篇<浅谈HTML5单页面架构(一)--requirejs + angular + a ...

  5. AngularJS进阶(二十五)requirejs + angular + angular-route 浅谈HTML5单页面架构

    requirejs + angular + angular-route 浅谈HTML5单页面架构 众所周知,现在移动Webapp越来越多,例如天猫.京东.国美这些都是很好的例子.而在Webapp中,又 ...

  6. html5获取自己定位的方法

    html5获取自己定位的方法直接用高德地图api 不要用百度地图api 不准确 <pre><!doctype html><html><head> < ...

  7. Android填坑系列：在小米系列等机型上放开定位权限后的定位请求弹框

    背景: 近期因实际项目需要,在特定操作下触发定位请求,取到用户位置及附近位置. 问题: 经初步选型,最终决定接入百度定位,按照百度定位SDK Android文档,接入过程相对顺利.但随后发现,在小米系 ...

  8. 你应该知道的10个奇特的 HTML5 单页网站

    网页设计师努力寻找新的方式来展现内容.其中一个大的趋势是单页网站,现在被世界上的一些大的品牌广泛采用,使用它们来为用户提供一个快速,干净和简单的而且​​美丽的网站. 下面是10个令人惊叹的单页 H​​ ...

  9. HTML5 总结-地理定位-6

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

随机推荐

  1. noip2014提高组day2二题题解-rLq

    (又是昨天的作业……本题写于昨天) (这破题都做这么久,我是不是吃枣药丸……) (好吧这是一道图论题呢) 本题地址:http://www.luogu.org/problem/show?pid=2296 ...

  2. AC日记——潜伏者 洛谷 P1071 （模拟）

    题目描述 R 国和 S 国正陷入战火之中,双方都互派间谍,潜入对方内部,伺机行动.历尽艰险后,潜伏于 S 国的 R 国间谍小 C 终于摸清了 S 国军用密码的编码规则: 1． S 国军方内部欲发送的原 ...

  3. Highlighting System

    Highlighting System 法线贴图漫反射着色器 Unity论坛:http://forum.unity3d.com/threads/143043-Highlighting-System-R ...

  4. unity3D里面的点乘和叉乘

    在unity3D里面.两个向量的点乘所得到的是两个向量的余弦值,也就是-1 到1之间,0表示垂直,-1表示相反,1表示相同方向. 两个向量的叉乘所得到的是两个向量所组成的面的垂直向量,分两个方向. 简 ...

  5. 解决Linux中java.net.UnknownHostException: oracledb.sys.iflashbuy.com问题

    Linux环境报java.net.UnknownHostException: oracledb.sys.iflashbuy.com,原因为Linux下无法解析oracledb.sys.iflashbu ...

  6. http协议详解<一>

    原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://7826443.blog.51cto.com/7816443/1729227 写在 ...

  7. Unity小知识

    这些是我在开发时遇到的一些问题: 2D的碰撞器和3D的碰撞器是没有任何物理反应的,必须是2D对2D,3D对3D 碰撞器Collision包含触发物体的速度等信息,触发器没有

  8. 多个相同jar存在时的引用顺序

    起因:今天一个aar包在测试环境中正常运行,使用soapui测试正常返回,在本地环境中运行则老是报数据库连接异常,经检查,是因为在运行时环境中缺少ojdbc相关的jar包引起的. 重新打了一个aar包 ...

  9. cannot change version web module 3.0

    eclipse如何修改dynamic web module version 由于从SVN down下来的工程java及tomcat 版本比本地高,导致工程不能编译,报以下错误. 1.Java comp ...

  10. JS实现点击跳转登陆邮箱

    前言 注册的过程中往往需要填写邮箱,并登陆邮箱进行验证.利用JS可以实现针对不同的邮箱进行点击登录验证,以下为实现方案,很简单 代码 邮箱域名数据   1 2 3 4 5 6 7 8 9 10 11 ...