JavaScript获取用户地理位置与城市信息的两种实现方式
作者:拾光时间:2026-10-22 13:49:09浏览:514
本文介绍两种在JavaScript中获取用户地理位置的方法。第一种通过新浪IP接口解析获取城市、省份和国家信息;第二种利用HTML5 Geolocation API获取经纬度坐标,并处理超时、拒绝及未知错误等状态。
通过IP接口获取城市信息
以下代码展示了如何使用JavaScript获取用户所在的城市信息,具体实现如下:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>获取用户地理位置</title>
<script type="text/javascript" src="./jquery-3.3.1.js"></script>
</head>
<body>
</body>
</html>
<script>
$.getScript('http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js',function(){
alert(remote_ip_info.country);//国家
alert(remote_ip_info.province);//省份
alert(remote_ip_info.city);//城市
});
</script>
使用Geolocation API获取经纬度
利用JavaScript获取用户的地理位置坐标
<script type="text/javascript">
var x = document.getElementById("x");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition, showError);
} else {
x.innerHTML = "该浏览器不支持定位功能!";
}
}
function showPosition(position) {
x.innerHTML = "纬度:" + position.coords.latitude + "\n经度:"
+ position.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;
}
}
getLocation();
</script>
总结
上述内容介绍了JavaScript获取用户所在城市及地理位置的相关方法,希望能对大家有所帮助。如有任何疑问,欢迎留言,小编会及时回复大家!
作者最新文章
JS处理含Emoji或中文的字符串转数组乱码问题
2026-11-05 16:12:28
JS怎么使用展开运算符合并对象
2026-11-05 14:42:18
ES6+环境下判断JS对象为空的简洁写法
2026-11-05 12:12:23
怎么通过replacer函数自定义JS中JSON的格式化输出
2026-11-05 11:19:44
JS正则表达式基础:字面量与RegExp构造函数的区别及常用元字符
2026-11-05 11:16:58
