<!DOCTYPE html>
<html>
<body>
<p>http协议支持部分浏览器</p>
<p>https支持所有浏览器</p>
<p id="demo">点击这个按钮,获得您的坐标:</p>
<button onclick="getLocation()">试一下</button>
<div id="mapholder"></div>
<script>
var x=document.getElementById("demo");
function getLocation(){
if (navigator.geolocation){
navigator.geolocation.getCurrentPosition(showPosition);
}else{
x.innerHTML="Geolocation is not supported by this browser.";
}
}
function showPosition(position){
x.innerHTML="Latitude: " + position.coords.latitude + "<br />Longitude: " + position.coords.longitude;
}
</script>
</body>
</html>

javascript 获取用户当前 经纬度 位置的更多相关文章

  1. 百度地图JavaScript API获取用户当前经纬度和详细地理位置,反之通过详细地理位置获取当前经纬度

    前言: 前端时间刚好使用了百度地图的js api定位获取用户当前经纬度并获取当前详细位置和通过当前用户详细地理位置换取用户当前经纬度坐标的功能,为了方便下次找起来方便一些自己在这里记录一下,希望也能够 ...

  2. 【用jQuery来判断浏览器的类型】及【javascript获取用户ip地址】

    用jQuery来判断浏览器的类型,主要是使用$.browser这个工具类,使用方法: $.browser.['浏览器关键字'] //谷歌浏览器.360浏览器等其他一些浏览器,没有专门的判断 funct ...

  3. javascript 获取用户光标,插入文本

    图1 如图1所示,点击[函数名称],将函数名称添加到表达式内容框中,点击参数名称,将参数名称index1作为方法的参数添加到表达式内容中的表达式中. 该功能实现主要是采用了javascript获取鼠标 ...

  4. Geolocation API JavaScript访问用户的当前位置信息

    Geolocation API在浏览器中的实现是navigator.geolocation对象,常用的有以下方法. 1.第一个方法是getCurrentPosition() 调用这个方法就会触发请求用 ...

  5. 百度地图API应用之获取用户的具体位置

    功能的大概:用户通过点击地图上面的位置,在地图上面进行描点,然后再把获取的到的地理位置保存到地图上面的地址栏目中. 主要是百度地图API的使用 .代码如下: var map = new BMap.Ma ...

  6. 用Javascript获取页面元素的位置

    制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...

  7. javascript获取以及设置光标位置

    一. 获取光标位置: // 获取光标位置 function getCursortPosition (textDom) { var cursorPos = 0; if (document.selecti ...

  8. javascript获取用户按了哪个键

    浏览器好像不允许js获取F5这个键的按下事件,应该屏蔽了,这个键太过特殊,猜测可能是,防止用户失去对浏览器的控制? <!DOCTYPE html> <html> <hea ...

  9. 详细解析 JavaScript 获取元素的坐标

    引言 最近突然看到了有关图片懒加载的问题,大致意思就是初始状态下页面只加载浏览器可视区域的图片,剩余图片在当浏览器可视区域滚动到其位置时才开始加载.貌似现在许多大型网站都有实现懒加载,所以我便就此问题 ...

随机推荐

  1. python中类变量和成员变量、局部变量总结

    class Member(): num= #类变量,可以直接用类调用,或用实例对象调用 def __init__(self,x,y): self.x=x #实例变量(成员变量),需要它是在类的构造函数 ...

  2. iOS.Library.Architecture

    在用file查看library的architechture时有以下输出: $ file WebPWebP: Mach-O universal binary with 3 architecturesWe ...

  3. FoxMail提示:请求的名称有效,但是找不到请求的类型的数据

    FoxMail发送或者接收邮件的时候,提示如下信息: <错误信息:请求的名称有效,但是找不到请求的类型的数据> 一,DNS解析不稳定 解决办法:修改本地电脑上面本地连接中的DNS地址< ...

  4. [Python] Python教程

    http://www.runoob.com/python/python-tutorial.html  

  5. [SoapUI] 在SoapUI中通过Groovy脚本执行window命令杀掉进程

    //杀Excel进程 String line def p = "taskkill /F /IM EXCEL.exe".execute() def bri = new Buffere ...

  6. TP QQ 微信 微博登录

    use Org\Util\QQconnect; use Org\Util\Wechatauth; use Org\Util\SaeTOAuthV2; use Org\Util\SaeTClientV2 ...

  7. 企业类Web原型制作分享-Kraftwerk

    这是一个设计师团队,将数码产品的创意发挥到极致.整个网站采用深黑色背景和图文搭配,网站有很多动画特效,均突出数码产品的质感.网站结合滚动区实现导航栏悬浮效果,用弹出面板实现点击弹出内容等交互效果. 本 ...

  8. 知名APP(支付宝、微信、花瓣等)首页设计技巧及原型实例讲解

    APP首页设计对APP自身来说是至关重要的,一款优秀的APP产品,其首页设计不仅需要清晰的展示产品核心功能,给用户创造良好的用户体验,而且还需要展示公司的品牌形象,提升在用户心中的品牌认知度.今天,就 ...

  9. Asterisk的type类型和身份认证

    Asterisk的type类型和身份认证 转载:http://zeevli.blog.163.com/blog/static/119591610201111745012380/ 在Asterisk中对 ...

  10. Hibernate学习笔记:注解@OneToMany和@ManyToOne的单独使用问题 不成对使用

    以某个实际场景为例,现在两张表:用户表User 订单表Order:很显然用户对订单是一对多的关系.二者注解如下 用户表User @Entity @Table(name="users" ...