JavaScript获取用户所在城市及地理位置


Posted in Javascript onApril 21, 2018

下面一段代码给大家分享js 获取用户所在城市,具体代码如下所述:

<!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>

JS获取用户地理位置

<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获取用户所在城市及地理位置,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
jQuery修改CSS伪元素属性的方法
Jul 30 Javascript
EasyUI中实现form表单提交的示例分享
Mar 01 Javascript
js实现接收表单的值并将值拼在表单action后面的方法
Nov 23 Javascript
jquery自定义插件开发之window的实现过程
May 06 Javascript
详细解读Jquery各Ajax函数($.get(),$.post(),$.ajax(),$.getJSON())
Aug 15 Javascript
jQuery EasyUI Tab 选项卡问题小结
Aug 16 Javascript
jQuery Dialog 打开时自动聚焦的解决方法(两种方法)
Nov 24 Javascript
js学习总结之DOM2兼容处理this问题的解决方法
Jul 27 Javascript
js求数组中全部数字可拼接出的最大整数示例代码
Aug 25 Javascript
WebPack配置vue多页面的技巧
May 15 Javascript
Vue extend的基本用法(实例详解)
Dec 09 Javascript
vue-router懒加载的3种方式汇总
Feb 28 Vue.js
在vue-cli项目中使用bootstrap的方法示例
Apr 21 #Javascript
详解webpack模块化管理和打包工具
Apr 21 #Javascript
Node.Js生成比特币地址代码解析
Apr 21 #Javascript
vue.js与element-ui实现菜单树形结构的解决方法
Apr 21 #Javascript
JS装饰器函数用法总结
Apr 21 #Javascript
vue 之 .sync 修饰符示例详解
Apr 21 #Javascript
关于echarts在节点显示动态数据及添加提示文本所遇到的问题
Apr 20 #Javascript
You might like
实战mysql导出中文乱码及phpmyadmin导入中文乱码的解决方法
2010/06/11 PHP
兼容性最强的PHP生成缩略图的函数代码(修改版)
2011/01/18 PHP
PHP常用正则表达式集锦
2014/08/17 PHP
js 函数调用模式小结
2011/12/26 Javascript
直接在JS里创建JSON数据然后遍历使用
2014/07/25 Javascript
jQuery中hide()方法用法实例
2014/12/24 Javascript
JavaScript里实用的原生API汇总
2015/05/14 Javascript
详解jQuery向动态生成的内容添加事件响应jQuery live()方法
2015/11/02 Javascript
JS获取随机数和时间转换的简单实例
2016/07/10 Javascript
vue-cli如何引入bootstrap工具的方法
2017/10/19 Javascript
详解Vue webapp项目通过HBulider打包原生APP(vue+webpack+HBulider)
2019/02/02 Javascript
JS实现电商商品展示放大镜特效
2020/01/07 Javascript
JavaScript JSON使用原理及注意事项
2020/07/30 Javascript
VUE中setTimeout和setInterval自动销毁案例
2020/09/07 Javascript
[40:48]DOTA2上海特级锦标赛D组败者赛 Liquid VS COL第二局
2016/02/28 DOTA
Python远程桌面协议RDPY安装使用介绍
2015/04/15 Python
Python中的条件判断语句基础学习教程
2016/02/07 Python
Python基于list的append和pop方法实现堆栈与队列功能示例
2017/07/24 Python
python requests爬取高德地图数据的实例
2018/11/10 Python
详解python 爬取12306验证码
2019/05/10 Python
python查看文件大小和文件夹内容的方法
2019/07/08 Python
在vscode中配置python环境过程解析
2019/09/28 Python
Python获取、格式化当前时间日期的方法
2020/02/10 Python
HTML5适合的情人节礼物有纪念日期功能
2021/01/25 HTML / CSS
GAP阿联酋官网:GAP UAE
2017/11/30 全球购物
销售员自我评价怎么写
2013/09/19 职场文书
高中数学教师求职信
2013/10/30 职场文书
民主评议党员自我评价材料
2014/09/18 职场文书
离婚协议书应该怎么写
2014/10/12 职场文书
党的群众路线教育实践活动整改落实情况报告
2014/10/28 职场文书
傲慢与偏见电影观后感
2015/06/10 职场文书
筑梦中国心得体会
2016/01/18 职场文书
七年级作文之游记
2019/12/11 职场文书
导游词之阳朔遇龙河
2019/12/16 职场文书
python如何获取网络数据
2021/04/11 Python
elementui的el-popover修改样式不生效的解决
2021/06/30 Javascript