<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Location</title>

</head>

<body>

My location is :

<button id="btn1" onclick="getLocation()">Click</button>

<p id="output"></p>

<script type="text/javascript">

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

function getLocation()

{

    if (navigator.geolocation)

    {

        navigator.geolocation.getCurrentPosition(showPosition);

    }

    else{output.innerHTML="Geolocation is not supported by this browser.";}

}

function showPosition(position)

{

    output.innerHTML="Latitude: " + position.coords.latitude +

        "<br />Longitude: " + position.coords.longitude;

}

</script>

</body>

</html>

　　

根据两点的经纬度，求距离：

参考：https://www.cnblogs.com/ycsfwhh/archive/2010/12/20/1911232.html

JS 获取当前定位的更多相关文章

  1. 原生js获取手机定位信息

    <script type="text/javascript"> function Location() {}; Location.prototype.getLocati ...

  2. Jquery和JS获取ul中li标签（转）

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

  3. JS获取/设置iframe内对象元素、文档的几种方法

    1.IE专用(通过frames索引形象定位): document.frames[i].document.getElementById('元素的ID'); 2.IE专用(通过iframe名称形象定位): ...

  4. JS 获取浏览器窗口大小

    JS 获取浏览器窗口大小 <script> // 获取窗口宽度 if (windows.innerWidth) { winWidth = windows.innerWidth; } els ...

  5. Jquery和JS获取ul中li标签

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

  6. Js获取当前日期时间

    Js获取当前日期时间 var myDate = new Date(); myDate.getYear(); //获取当前年份(2位) myDate.getFullYear(); //获取完整的年份(4 ...

  7. JS 获取浏览器和屏幕宽高等信息代码

    JS 获取浏览器和屏幕宽高等信息. 网页可见区域宽:document.body.clientWidth  网页可见区域高:document.body.clientHeight  网页可见区域宽:doc ...

  8. js获取浏览器高度和宽度值,尽量的考虑了多浏览器。

    js获取浏览器高度和宽度值,尽量的考虑了多浏览器. IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ...

  9. js获取浏览器基本信息：document.body.clientWidth/clientHeight/scrollWidth/scrollTop。（转）

    js获取浏览器基本信息:document.body.clientWidth/clientHeight/scrollWidth/scrollTop. 分类: js.jquery.ext.js技术2011 ...

随机推荐

  1. 【leetcode】1291. Sequential Digits

    题目如下: An integer has sequential digits if and only if each digit in the number is one more than the ...

  2. PHP mysqli_num_fields() 函数

    mysqli_num_fields() 函数返回结果集中字段(列)的数量. 语法 mysqli_num_fields(result); 参数 描述 result 必需.规定由 mysqli_query ...

  3. CSP-S2019游记——终点

    准退役一年了,回来苟CSP,填补去年留下的遗憾,也算是为这个不那么完美的高中OI生涯划一个句点吧. DAY 1 考前:昨天晚上睡得不太好.早上洛谷打卡居然是中吉(3K说的大吉嘞???).在地铁上有点犯 ...

  4. 《30天自制操作系统》学习笔记--Mac下工具的使用

    现在来介绍官网上下的工具怎么用首先是官网地址,书上有个注释上有:hrb.osask.jp 翻译成中文大概是这个样子滴. 上面有两个文件可以下载,一个是工具,一个是工具的源代码,很好的学习资料 下面把工 ...

  5. python 绘制f(x)=x^2

    code import turtle import math turtle.speed() # 画一个平方的函数 turtle.penup() turtle., *) turtle.pendown() ...

  6. 【java设计模式】-06原型模式

    原型模式简述 定义: 使用原型实例指定待创建对象的类型,并且通过复制这个原型来创建新的对象 ,也就是通过复制现有对象实例产生新的对象,也就是所谓的"克隆" 实现方式: 1.实现Cl ...

  7. mysql：unknown variable 'default-character-set=utf8'

    1.修改my.cnf后,执行 service mysql restart 重启数据库失败 service mysql restart Shutting down MySQL.. SUCCESS! St ...

  8. 【sed】进阶

      sed的基本用法已能满足大多数需求,但当需要时,知道这些高级特效的存在及如何使用将提供莫大的帮助!   1. 多行命令         sed编辑器提供三个用于处理多行文本的特殊命令: N:将数据 ...

  9. Linux设备驱动程序 之 Makefile

    典型的模块Makefile如下所示: ifneq ($(KERNELRELEASE),) obj-m := hello.o else KERNELDIR ?=/lib/modules/$(shell ...

  10. qt QTableView中嵌入复选框CheckBox 的四种方法总结

    第一种不能之前显示,必须双击/选中后才能显示,不适用. 第二种比较简单,通常用这种方法. 第三种只适合静态显示静态数据用 第四种比较适合扩展,它除了可以嵌入复选框,还可以通过paint()绘制其它控件 ...