JS获取当前地理位置的方法


Posted in Javascript onOctober 25, 2017

本文实例为大家分享了JS获取当前地理位置方法的具体代码,供大家参考,具体内容如下

1.手机定位

var getLocation = function (successFunc, errorFunc) { 
  //successFunc获取定位成功回调函数,errorFunc获取定位失败回调
  //首先设置默认城市
  var defCity = {
    id: '000001',
    name: '北京市',
    date: curDateTime()//获取当前时间方法
  };
  //默认城市
  $.cookie('VPIAO_MOBILE_DEFAULTCITY', JSON.stringify(defCity), { expires: 1, path: '/' });
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function (position) {
      var lat = position.coords.latitude;
      var lon = position.coords.longitude;
      //var map = new BMap.Map("container");  // 创建Map实例
      var point = new BMap.Point(lon, lat); // 创建点坐标
      var gc = new BMap.Geocoder();
      gc.getLocation(point, function (rs) {
        var addComp = rs.addressComponents;
        var curCity = {
          id: '',
          name: addComp.province,
          date: curDateTime()
        };
        //当前定位城市
        $.cookie('VPIAO_MOBILE_CURRENTCITY', JSON.stringify(curCity), { expires: 7, path: '/' });
        //alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street);
        if (successFunc != undefined)
          successFunc(addComp);
      });
    },
    function (error) {
      switch (error.code) {
        case 1:
          alert("位置服务被拒绝。");
          break;
        case 2:
          alert("暂时获取不到位置信息。");
          break;
        case 3:
          alert("获取位置信息超时。");
          break;
        default:
          alert("未知错误。");
          break;
      }
      var curCity = {
        id: '000001',
        name: '北京市',
        date: curDateTime()
      };
      //默认城市
      $.cookie('VPIAO_MOBILE_DEFAULTCITY', JSON.stringify(curCity), { expires: 1, path: '/' });
      if (errorFunc != undefined)
        errorFunc(error);
    }, { timeout: 5000, enableHighAccuracy: true });
  } else {
    alert("你的浏览器不支持获取地理位置信息。");
    if (errorFunc != undefined)
      errorFunc("你的浏览器不支持获取地理位置信息。");
  }
};
var showPosition = function (position) {
  var lat = position.coords.latitude;
  var lon = position.coords.longitude;
  //var map = new BMap.Map("container");  // 创建Map实例
  var point = new BMap.Point(lon, lat); // 创建点坐标
  var gc = new BMap.Geocoder();
  gc.getLocation(point, function (rs) {
    var addComp = rs.addressComponents;
    var curCity = {
      id: '',
      name: addComp.province,
      date: curDateTime()
    };
    //当前定位城市
    $.cookie('VPIAO_MOBILE_CURRENTCITY', JSON.stringify(curCity), { expires: 7, path: '/' });
    //alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street);
  });
};
var showPositionError = function (error) {
  switch (error.code) {
    case 1:
      alert("位置服务被拒绝。");
      break;
    case 2:
      alert("暂时获取不到位置信息。");
      break;
    case 3:
      alert("获取位置信息超时。");
      break;
    default:
      alert("未知错误。");
      break;
  }
  var curCity = {
    id: '000001',
    name: '北京市',
    date: curDateTime()
  };
  //默认城市
  $.cookie('VPIAO_MOBILE_DEFAULTCITY', JSON.stringify(curCity), { expires: 1, path: '/' });
};

前提要引入百度API: <script src="http://api.map.baidu.com/api?v=1.4" type="text/javascript"></script>

2.获取客户端IP方法

<script>
var url = 'http://chaxun.1616.net/s.php?type=ip&output=json&callback=?&_=' + Math.random();
      $.getJSON(url, function(data) {
        alert(data.Ip);
      });
</script>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
使用jQuery的将桌面应用程序引入浏览器
Nov 19 Javascript
ie7+背景透明文字不透明超级简单的实现方法
Jan 17 Javascript
Js实现动态添加删除Table行示例
Apr 14 Javascript
让JavaScript的Alert弹出框失效的方法禁止弹出警告框
Sep 03 Javascript
javascript实现日期格式转换
Dec 16 Javascript
ECMAScript6块级作用域及新变量声明(let)
Jun 12 Javascript
JS实现列表页面隔行变色效果
Mar 25 Javascript
史上最全JavaScript常用的简写技巧(推荐)
Aug 17 Javascript
vue父组件点击触发子组件事件的实例讲解
Feb 08 Javascript
vue2.0 实现导航守卫(路由守卫)
May 21 Javascript
vue瀑布流组件实现上拉加载更多
Mar 10 Javascript
如何正确解决VuePress本地访问出现资源报错404的问题
Dec 03 Vue.js
JavaScript 异步调用
Oct 25 #Javascript
parabola.js抛物线与加入购物车效果的示例代码
Oct 25 #Javascript
通过js控制时间,一秒一秒自己动的实例
Oct 25 #Javascript
js 显示日期时间的实例(时间过一秒加1)
Oct 25 #Javascript
JavaScript编程设计模式之观察者模式(Observer Pattern)实例详解
Oct 25 #Javascript
BootStrap 标题设置跨行无效的解决方法
Oct 25 #Javascript
vue基于mint-ui的城市选择3级联动的示例
Oct 25 #Javascript
You might like
PHP实现图片简单上传
2006/10/09 PHP
php学习 函数 课件
2008/06/15 PHP
详解PHP安装mysql.so扩展的方法
2016/12/31 PHP
用javascript实现的激活输入框后隐藏初始内容
2007/06/29 Javascript
用js来解决ajax读取页面乱码
2010/11/28 Javascript
Javascript insertAfter() 实现函数代码
2011/10/12 Javascript
js实现在字符串中提取数字
2013/11/05 Javascript
D3.js中data(), enter() 和 exit()的问题详解
2015/08/17 Javascript
JS实现线性表的顺序表示方法示例【经典数据结构】
2017/04/11 Javascript
PHP实现记录代码运行时间封装类实例教程
2017/05/08 Javascript
详解用vue.js和laravel实现微信支付
2017/06/23 Javascript
解决vuejs 使用value in list 循环遍历数组出现警告的问题
2018/09/26 Javascript
seajs和requirejs模块化简单案例分析
2019/08/26 Javascript
layer实现登录弹框,登录成功后关闭弹框并调用父窗口的例子
2019/09/11 Javascript
关于Layui Table隐藏列问题
2019/09/16 Javascript
vuex存储token示例
2019/11/11 Javascript
vue 实现锚点功能操作
2020/08/10 Javascript
Python高级应用实例对比:高效计算大文件中的最长行的长度
2014/06/08 Python
Python实现返回数组中第i小元素的方法示例
2017/12/04 Python
解决PyCharm控制台输出乱码的问题
2019/01/16 Python
python3 小数位的四舍五入(用两种方法解决round 遇5不进)
2019/04/11 Python
Python-接口开发入门解析
2019/08/01 Python
python 并发编程 阻塞IO模型原理解析
2019/08/20 Python
关于python 的legend图例,参数使用说明
2020/04/17 Python
Django-imagekit的使用详解
2020/07/06 Python
五种Python转义表示法
2020/11/27 Python
HTML中meta标签及Keywords
2020/04/15 HTML / CSS
全球航班旅行搜索网站:Cheapflights
2017/05/19 全球购物
教学大赛获奖感言
2014/01/15 职场文书
职业生涯规划书结束语
2014/04/15 职场文书
森林病虫害防治方案
2014/06/02 职场文书
供电工程专业求职信
2014/08/09 职场文书
作风建设年活动总结
2014/08/27 职场文书
2015年教学管理工作总结
2015/05/20 职场文书
浅谈Redis中的RDB快照
2021/06/29 Redis
《游戏王:大师决斗》新活动上线 若无符合卡组可免费租用
2022/04/13 其他游戏