使用navigator对象的geolocation获取地理位置

分手后的思念是犯贱 2022-05-12 00:42 245阅读 0赞

**一 介绍**

HTML5为navigator新增了一个geolocation属性，这个属性是一个Geolocation对象，通过该对象获取浏览者的地理位置。

下面应用示范了geolocation的用法。

**二 代码**

<script type="text/javascript">
    	var geoHandler = function(position)
    	{
    		var geoMsg = "用户的所在的地理位置信息是：<br/>";
    		geoMsg += "timestamp属性为：" + position.timestamp + "<br/>";
    		// 获取Coordinates对象，该对象里包含了详细的地理位置信息
    		var coords = position.coords;
    		// 遍历Coordinates对象的所有属性
    		for(var prop in coords)
    		{
    			geoMsg += prop + "-->" + coords[prop] + "<br/>";
    		}
    		// 输出地理位置信息
    		document.writeln(geoMsg);
    	}
    	var errorHandler = function(error)
    	{
    		// 为不同错误代码定义错误提示
    		var errMsg = {
    			1: '用户拒绝了位置服务',
    			2: '无法获取地址位置信息',
    			3: '获取地理位置信息超时'
    		};
    		// 弹出错误提示
    		alert(errMsg[error.code]);
    	}
    	// 获取地理位置信息
    	navigator.geolocation.getCurrentPosition(geoHandler
    		, errorHandler
    		, {
    			enableHighAccuracy:true,
    			maximumAge:1000
    		});
    </script>

**三 运行结果**

![d1e1509a-57ca-3ef4-b85c-a2af3a19d372.png][]

[d1e1509a-57ca-3ef4-b85c-a2af3a19d372.png]: /images/20220512/ec915145b2c3402fa650466e8ae016d8.png

发表评论取消回复

表情：

评论列表（有 0 条评论，245人围观）

还没有评论，来说两句吧...

相关阅读

相关获取地理位置

可根据获取到的经纬度查询到所在的地理位置。 ![img2018-cnblogs-com_blog_1401533_201810_1401533-201810181444204

淡淡的烟草味﹌/ 2023年06月05日 12:52/ 0 赞/ 28 阅读

相关 HTML5 Geolocation（地理定位）用于定位用户的位置。

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

谁践踏了优雅/ 2023年02月08日 12:56/ 0 赞/ 70 阅读

相关 Appium-Set Geolocation(设置地理位置)

Set Geolocation Example Usage Support

亦凉/ 2022年11月17日 10:22/ 0 赞/ 219 阅读

相关 HTML5 地理位置定位（HTML5 Geolocation）

地理位置（Geolocation）是 [HTML5][HTML5] 的重要特性之一，提供了确定用户位置的功能，借助这个特性能够开发基于位置信息的应用。今天这篇文章向大家

秒速五厘米/ 2022年08月02日 09:34/ 0 赞/ 284 阅读

相关 cordova-plugin-geolocation设备地理位置整理

一、Cordova Geolocation插件 1.用户获取设备物理位置信息，这个API是基于W3C Geolocation API规范，关于HTML5 Geolocatio

爱被打了一巴掌/ 2022年07月12日 19:08/ 0 赞/ 426 阅读

相关使用navigator对象的geolocation获取地理位置

一介绍 HTML5为navigator新增了一个geolocation属性，这个属性是一个Geolocation对象，通过该对象获取浏览者的地理位置。下面应用示范了ge

分手后的思念是犯贱/ 2022年05月12日 00:42/ 0 赞/ 246 阅读

相关 H5带地理位置API获取地理位置

支持地理位置API的浏览器会定义navigator.grolocation属性，该属性拥有三个方法： 1，navigator.geolocation.getCurrentP

男娘i/ 2022年05月08日 08:12/ 0 赞/ 451 阅读

相关 React Native - 使用Geolocation进行定位（获取当前位置、监听位置变化）

React Native 提供了 Geolocation API，让我们可以很方便的获取当前的位置信息，或者监听位置的变化。下面通过样例演示如何使用。一、获取当前的

Dear 丶/ 2022年04月25日 04:40/ 0 赞/ 725 阅读

相关 LayaAir Geolocation 获取地理位置

Geolocation 1、如果设备支持 Geolocation(地理定位)，并且所使用的浏览器支持，就可以使用 Geolocation 获取设备的当前地理位置。可以打开

川长思鸟来/ 2022年04月10日 02:29/ 0 赞/ 406 阅读

相关 HTML5 之Geolocation API (地理位置应用程序接口)

目前PC浏览器支持情况： Firefox 3.5+ Chrome 5.0+ Safari 5.0+ Opera 10.60+ Internet Explore

你的名字/ 2021年05月12日 11:51/ 0 赞/ 710 阅读