HTML5 地理位置定位API（3）
HTML5 地理位置定位实例
这篇文章主要为大家介绍了HTML5地理定位的方法,实例讲述了html5获取坐标完整实现过程,
并对比不同浏览器运行效果给出参考结果,需要的朋友可以参考下
本文实例讲述了html5获取地理定位的方法，分享给大家供大家参考。具体方法如下：
html5 获取坐标代码如下：
代码如下:
<html>
<head>
<title>test1.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<div id="demo">点击这个按钮，获得您的坐标：</div>
<button onclick="getLocation()">试一下</button>
<script type="text/javascript">
var x=document.getElementById("demo");
function getLocation(){
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(showPosition);
}else{
x.innerHTML="浏览器不支持！！！";
}
}
function showPosition(position){
x.innerHTML="Latitude: "+position.coords.latitude+"<br/>Longitude: "+position.coords.longitude;
}
</script>
</body>
</html>
经测试，在IE9 、firefox、chrome、opera上都可以成功获取到坐标位置，但是safari 5.x上却不能返回坐标，暂时木有找到原因。成功的案例里头，chrome响应的速度最快，其次是opera，然后是IE9，firefox居然是最慢 的。个人表示对firefox很失望，不过chrome倒是越来棒了。
希望本文所述对大家的HTML5程序设计有所帮助。
HTML5 地理位置定位API（3）的更多相关文章
- HTML5 地理位置定位API（1）
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- HTML5 地理位置定位API（5）
HTML5 Geolocation API (地理位置应用程序接口) 目前PC浏览器支持情况: Firefox 3.5+Chrome 5.0+Safari 5.0+Opera 10.60+Intern ...
- HTML5 地理位置定位API（2）
HTML5 Geolocation API (地理位置应用程序接口) 目前PC浏览器支持情况: Firefox 3.5+Chrome 5.0+Safari 5.0+Opera 10.60+Intern ...
- HTML5 地理位置定位API（4）
地理定位(geolocation)是最令人兴奋,而且得到了广泛支持的一个新API.通过这套API, JavaScript代码能够访问到用户的 当前位置信息.当然,访问之前必须得到用户的明确许可,即同意 ...
- HTML5 地理位置定位（HTML5 Geolocation）原理及应用
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- [Javascript] HTML5 地理位置定位（HTML5 Geolocation）原理及应用
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- 使用HTML5地理位置定位到城市的方法及注意事项
介绍 本文将简述一下如何通过HTML5和百度地图开放平台提供的API来实现对浏览器的定位.实现效果为显示出用户所在的省市,即: XXX省 XXX市. 实现思路 利用HTML5 提供的API获取到用户的 ...
- html5地理位置定位功能小析
Geolocationd 基本原理1.GPS GPS基本原理是测量出已知位置的卫星到用户接收机之间的距离,然后综合多颗卫星的数据就可知道接收机的具体位置.适用于具备GPS功能的设备(1)优点:在 ...
- HTML5地理定位API在chrome中不能正常使用
navigator.geolocation.getCurrentPosition在chrome中不能正常使用. 经测试发现,FQ后就能正常使用,估计是因为chrome 对这个API的实现使用了goog ...
随机推荐
- linux下的缓存机制buffer、cache、swap - 运维总结 ["Cannot allocate memory"问题]
一.缓存机制介绍 在Linux系统中,为了提高文件系统性能,内核利用一部分物理内存分配出缓冲区,用于缓存系统操作和数据文件,当内核收到读写的请求时,内核先去缓存区找是否有请求的数据,有就直接返回,如果 ...
- sqlalchemy.exc.CompileError: (in table 'user', column 'username'): VARCHAR requires a length on dialect mysql
映射数据库时报错:sqlalchemy.exc.CompileError: (in table 'user', column 'username'): VARCHAR requires a lengt ...
- SpringCloud2.0 概述 基础教程(一)
1.SpringCloud简介 Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智能路由,微代理,控制总线,一次性令牌,全局锁,领导选举 ...
- 分布式系统：CAP理论
无论你是一个系统架构师,还是一个普通开发,当你开发或者设计一个分布式系统的时候,CAP理论是无论如何也绕不过去的.本文就来介绍一下到底什么是CAP理论,如何证明CAP理论,以及CAP的权衡问题. CA ...
- Scrapy框架的八个扩展
一.proxies代理 首先需要在环境变量中设置 from scrapy.contrib.downloadermiddleware.httpproxy import HttpProxyMiddlewa ...
- php数据类型之浮点型
所谓浮点类型,可以理解为:我们数学里面的小数. [注意]关于精度.取值范围和科学型声明不是学习的重点.因为此块在实际开发中用的特别少.我们将此块的知识点的学习标注为,了解级别.直线电机滑台 声明方式分 ...
- HTML怎么块外横向剧中
HTML 块外横向剧中 在HTML中有一个块外横向剧中的代码 那就是margin:0 auto 这个能是块内元素横向剧中 剧中前: 剧中后
- MVC 元数据验证
ASP.NET MVC 3 Validation - 正则表达式验证RegularExpressionAttribute之日期验证 http://blog.csdn.net/jackvs/articl ...
- Educational Codeforces Round 69
目录 Contest Info Solutions A. DIY Wooden Ladder B. Pillars C. Array Splitting D. Yet Another Subarray ...
- selenium+chromeDriver配合使用（运行js脚本）
在python中调用selenium,访问百度,并运行js脚本爬取内容 python入口程序 from selenium import webdriver import time with open( ...