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

下面是个获取经纬度的简单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. [转]响应式网页设计:rem、em设置网页字体大小自适应

    本文转自:http://www.cnblogs.com/aimyfly/archive/2013/07/19/3200742.html 「rem」是指根元素(root element,html)的字体 ...

  2. [cb]NGUI组件基类之 UIWidget

    UIWidget NGUI的UIWidget是所有组件的基类,它承担了存储显示内容,颜色调配,显示深度,显示位置,显示大小,显示角度,显示的多边形形状,归属哪个UIPanel.这就是UIWidget所 ...

  3. 使用 ssh 连接github的方法说明(gitub的官方说法)

    https://help.github.com/articles/generating-an-ssh-key/

  4. phpmyadmin后台拿shell方法总结

    方法一: CREATE TABLE `mysql`.`xiaoma` (`xiaoma1` TEXT NOT NULL ); INSERT INTO `mysql`.`xiaoma` (`xiaoma ...

  5. JavaScript基于时间的动画算法

    转自:https://segmentfault.com/a/1190000002416071 前言 前段时间无聊或有聊地做了几个移动端的HTML5游戏.放在不同的移动端平台上进行测试后有了诡异的发现, ...

  6. Linux Shell编程二

    以"``"符号包含的内容不是字符串,而是代表这是一个shell命令. echo "today is" `date` 前面是字符,后面`date`表示执行date ...

  7. C语言 数组之无限循环

    #include<stdio.h> #include<stdlib.h> #include<Windows.h> //定于数组的大小 #define N 10 vo ...

  8. StringBuffer类 和 StringBuilder类

    上一篇中讲解了String类的用法.那么String有什么特点呢? 字符串特点:字符串是常量,其值在创建后就不能被修改.字符串的内容一旦发生变化,就会创建一个新的对象. 代码验证字符串特点: publ ...

  9. .net面试题(.Net+Html+Javascript)

    .net方面 1.简述 private. protected. public. internal 修饰符的访问权限. 2.override与重载的区别 3..net值类型和引用类型的区别,写出代码样例 ...

  10. gunzip 和 unzip 解压文件到指定的目录

    Linux 常用的压缩命令有 gzip 和 zip,两种压缩包的结尾不同:zip 压缩的后文件是 *.zip ,而 gzip 压缩后的文件 *.gz  相应的解压缩命令则是 gunzip 和 unzi ...