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实现等比例缩放图片效果插件
Jul 24 Javascript
CSS+jQuery实现的一个放大缩小动画效果
Sep 24 Javascript
JS中window.open全屏命令解析及使用示例
Dec 11 Javascript
深入探究AngularJS框架中Scope对象的超级教程
Jan 04 Javascript
AngularJS基础 ng-model-options 指令简单示例
Aug 02 Javascript
Node.js微信 access_token ( jsapi_ticket ) 存取与刷新的示例
Sep 30 Javascript
详解Vue 全局引入bass.scss 处理方案
Mar 26 Javascript
layui内置模块layim发送图片添加加载动画的方法
Sep 23 Javascript
vue项目中使用vue-layer弹框插件的方法
Mar 11 Javascript
vue设置全局访问接口API地址操作
Aug 14 Javascript
vue3+typeScript穿梭框的实现示例
Dec 29 Vue.js
vue代码分块和懒加载非必要资源文件
Apr 11 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编程函数安全篇
2013/01/08 PHP
PHP mysql与mysqli事务使用说明 分享
2013/08/17 PHP
PHP禁止个别IP访问网站
2013/10/30 PHP
ThinkPHP快速入门实例教程之数据分页
2014/07/01 PHP
Laravel 5框架学习之表单验证
2015/04/08 PHP
Nginx下ThinkPHP5的配置方法详解
2017/08/01 PHP
Laravel Eloquent ORM 多条件查询的例子
2019/10/10 PHP
CSS3画一个阴阳八卦图
2021/03/09 HTML / CSS
baidu博客的编辑友情链接的新的层窗口!经典~支持【FF】
2007/02/09 Javascript
javascript温习的一些笔记 基础常用知识小结
2011/06/22 Javascript
js判断设备是否为PC并调整图片大小
2014/02/12 Javascript
有关jQuery中parent()和siblings()的小问题
2016/06/01 Javascript
JS拉起或下载app的实现代码
2017/02/22 Javascript
jquery实现焦点轮播效果
2017/02/23 Javascript
利用node.js爬取指定排名网站的JS引用库详解
2017/07/25 Javascript
微信小程序实现富文本图片宽度自适应的方法
2019/01/20 Javascript
ES10 特性的完整指南小结
2019/03/04 Javascript
Node.js+ELK日志规范的实现
2019/05/23 Javascript
JavaScript 中的无穷数(Infinity)详解
2020/02/13 Javascript
使用Webpack 搭建 Vue3 开发环境过程详解
2020/07/28 Javascript
Python写的一个简单监控系统
2015/06/19 Python
Python中的条件判断语句与循环语句用法小结
2016/03/21 Python
浅谈Python2获取中文文件名的编码问题
2018/01/09 Python
详解opencv Python特征检测及K-最近邻匹配
2019/01/21 Python
python实现的Iou与Giou代码
2020/01/18 Python
python使用正则表达式匹配txt特定字符串(有换行)
2020/12/09 Python
python爬虫利用selenium实现自动翻页爬取某鱼数据的思路详解
2020/12/22 Python
英国优质鞋类专家:Robinson’s Shoes
2017/12/08 全球购物
什么是静态路由,其特点是什么?什么是动态路由,其特点是什么?
2013/07/26 面试题
仓管员岗位职责范文
2013/11/08 职场文书
旷课检讨书2000字
2014/01/14 职场文书
网上签名寄语活动留言
2014/01/18 职场文书
应届大学生求职信
2014/07/20 职场文书
黄山导游词
2015/01/31 职场文书
食堂卫生管理制度
2015/08/04 职场文书
Oracle笔记
2021/04/05 Oracle