HTML5 Geolocation(地理位置)、是用来定位用户的位置的。

HTML5 Geolocation API 用于获得用户的地理位置，鉴于该特性可能侵犯用户的隐私权，除非用户同意，否则不能获取用户的位置信息。

请使用getCurrentPosition()方法来获取用户的地理位置信息

提示：HTML5 Geolocation(地理位置)对于使用GPS的设备，对地理位置的定位更加精确：如：手机。

实例：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta charset="utf-8" />
<style type="text/css"></style>
<script type="text/javascript" src="Css/jquery-2.1.4.js"></script>
<script type="text/javascript"></script>
</head>
<body>
<p>点击按钮获取您的地理位置信息(可能需要比较长的时间获取):<span id="result"></span></p>
<button onclick="getLocation()">点击按钮</button>
<script>
var x = document.getElementById("result");
function getLocation() {
if (navigator.geolocation) {//检测浏览器是否支持geolocation(地理位置)
navigator.geolocation.getCurrentPosition(showLocation,showError);//如果运行成功，则使用getCurrentLocation()方法的参数规定中的函数返回一个coordinates对象
}
else {
x.innerHTML = "Sorry!,您浏览器不支持HTML5的geolocation";//您浏览器不支持HTML5的geolocation
}
}
function showLocation(weizi) {//函数获取地理位置的纬度和经度
x.innerHTML = "纬度：" + weizi.coords.lataitude + " <br />经度：" + weizi.coords.longitude;
}
function showError(error) {//函数获取错误的信息
switch (error.code)
{
case error.PERMISSION_DENIED:
x.innerHTML="用户拒绝对获取地理位置的请求";
break;
case error.POSITION_UNAVAILABLE:
x.innerHTML = "位置信息是不可用的";
break;
case error.TIMEOUT:
x.innerHTML = "请求用户地理位置超时"
break;
case error.UNKNOWN_ERROR:
x.innerHTML = "未知错误"
break;
}
}
</script>
</body>
</html>

HTML5 Geolocation(地理位置)的更多相关文章

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

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

  2. HTML5 地理位置定位（HTML5 Geolocation）原理及应用

    地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...

  3. HTML5 Geolocation 构建基于地理位置的 Web 应用

    HTML5 中的新功能 HTML5 是最新一代的 HTML 规范,是 W3C 与 WHATWG 合作的结果,目前仍外于开发中.自从上一代 HTML4,Web 世界已经发生了巨大的变化,HTML5 的到 ...

  4. Html5 Geolocation获取地理位置信息

    Html5中提供了地理位置信息的API,通过浏览器来获取用户当前位置.基于此特性可以开发基于位置的服务应用.在获取地理位置信息前,首先浏览器都会向用户询问是否愿意共享其位置信息,待用户同意后才能使用. ...

  5. Html5 Geolocation获取地理位置信息(转)

    Html5中提供了地理位置信息的API,通过浏览器来获取用户当前位置.基于此特性可以开发基于位置的服务应用.在获取地理位置信息前,首先浏览器都会向用户询问是否愿意共享其位置信息,待用户同意后才能使用. ...

  6. [Javascript] HTML5 地理位置定位（HTML5 Geolocation）原理及应用

    地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...

  7. 基于HTML5 geolocation 实现的天气预报功能

    最近一直在学习HTML5,因为8月份要开发手机项目了.所以先把HTML5学习下. 基本思路: 1. 用户未设置任何城市之前,根据HTML5 geolocation 获取用户所在的地理位置. 2. 根据 ...

  8. html5 geolocation API

    清单 1. 检查浏览器支持性if (navigator.geolocation) 清单 2. 单次定位请求 API void getCurrentPosition(updateLocation, op ...

  9. HTML5编程之旅系列一：HTML5 Geolocation 初探

    让我们假设这样一个场景,有一个web应用程序,它可以向用户提供附近不远处某商场的打折优惠信息.使用HTML5 Geolocation API(地理定位 API),可以请求用户共享他们的位置信息. HT ...

随机推荐

  1. 求N!的长度【数学】

    转自:http://blog.csdn.net/fengdian29147001/article/details/11992755 给一个数X,len=log10(X)+1就是X这个数的长度 ①:当N ...

  2. vim 快速定位到文件末尾、头部

    gg           : 跳转到文件头 Shift+g   : 跳转到文件末尾 行数+gg : 跳转到指定行,例跳转到123行:123gg

  3. 几例实用的Shell脚本

    日常工作中,经常编写一些shell命令或脚本以完成重复性操作,本文分享了最近用到的几例shell实用脚本. 1 特殊文件名的远程拷贝 服务器之间拷贝文件经常使用scp命令,其命令格式: (1)scp ...

  4. 执行gulp build报错

    问题与分析 在执行gulp build报错如下: D:\coding\Resume\Resumes>gulp build gulp build[5628]: src\node_contextif ...

  5. C# 基础之字段与属性

    1.属性是字段的扩展 2.根据面向对象封装思想,字段最好设为private(私有),这样有利于防止客户端对字段的篡改,从而保证了成员的完整性 3.访问类中私有字段,C#提供了属性,用来对字段进行灵活的 ...

  6. php—cURL库基本用法总结

    作用 用来连接客户端和服务器端,实从互联网上获取资源 常用接口 curl_init(): 初始化curl curl_close: 结束curl,释放资源 curl_setopt: 设置curl的属性 ...

  7. 防止a标签跳转的几种方法

    第一种方法 在a标签的href中添加属性值 <a href="javascript:void(0)"></a> 第二种方法 给a标签添加点击事件,函数的返回 ...

  8. centOS6.5 usr/src/kernels下为空

    用uname -r查看内核版本为 2.6.32-431.el6.x86_64 usr/src/kernels下为空 需要执行两个安装 yum install kernel-headers yum in ...

  9. springmvc写了方法无法访问

    1.检查是否添加了@controller注解 2.在springmvc.xml里添加controller注解扫描 3.在applicationContext.xml里添加service扫描,给mapp ...

  10. CSS修改Autocomplete样式

    举个场景:在用户登录成功的时候,浏览器有时候会咨询你是否记住密码,当你记住密码下次登录的时候,标签会自动填充,但是这样会造成样式不统一,解决办法如下: input:-webkit-autofill, ...