百度云盘　　传送门 　　密码：l94p

实现效果：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>获取当前IP地址和省市地区位置代码</title>

</head>

<script src="js/jquery.min.js"></script>

<style type="text/css">

    .box{text-align: center;}

</style>

<body>

<div class="box">

    <h1>AJAX检测ip和地区</h1>

    <p id="city"></p>

    <p id="ip"></p>

</div>

<script type="text/javascript">

$(function(){

    //获取城市ajax

    $.ajax({

    url: 'http://api.map.baidu.com/location/ip?ak=ia6HfFL660Bvh43exmH9LrI6',

    type: 'POST',

    dataType: 'jsonp',

    success:function(data) {

        console.log(JSON.stringify(data.content.address_detail.province + "," + data.content.address_detail.city));

        $('#city').html(JSON.stringify(data.content.address_detail.province + "," + data.content.address_detail.city))

    }

    });

    //获取ip ajax

    $.ajax({

        url: 'http://freegeoip.net/json/',

        success: function(data){

           console.log(JSON.stringify(data.ip));

           $('#ip').html(JSON.stringify(data.ip))

        },

        type: 'GET',

        dataType: 'JSON'

    });

})

</script>

</body>

</html>

index.html

<script type="text/javascript">

$(function(){

    //获取城市ajax

    $.ajax({

    url: 'http://api.map.baidu.com/location/ip?ak=ia6HfFL660Bvh43exmH9LrI6',

    type: 'POST',

    dataType: 'jsonp',

    success:function(data) {

        console.log(JSON.stringify(data.content.address_detail.province + "," + data.content.address_detail.city));

        $('#city').html(JSON.stringify(data.content.address_detail.province + "," + data.content.address_detail.city))

    }

    });

    //获取ip ajax

    $.ajax({

        url: 'http://freegeoip.net/json/',

        success: function(data){

           console.log(JSON.stringify(data.ip));

           $('#ip').html(JSON.stringify(data.ip))

        },

        type: 'GET',

        dataType: 'JSON'

    });

})

</script>

JS框架_(AJAX)检测ip和地区的更多相关文章

  1. 检测ip和地区

    获取当前位置所在省份城市和所用网络IP <!DOCTYPE html> <html> <head> <meta charset="utf-8&quo ...

  2. vue_简介_渐进式 js 框架_内置指令_自定义指令_自定义插件

    vue 尤雨溪 华裔 Google 工程师 遵循 MVVM 模式 编码简洁,体积小,运行效率高,适合 移动 / PC 端 开发 动态构建用户界面: 异步获取后台数据,展现到页面 渐进式 js 框架 渐 ...

  3. JS框架_(JQuery.js)模拟刮奖

    百度云盘:传送门 密码:6p5q 纯CSS模拟刮奖效果 <!DOCTYPE html> <html lang="en"> <head> < ...

  4. JS框架_(JQuery.js)绚丽的3D星空动画

    百度云盘: 传送门 密码:8ft8 绚丽的3D星空动画效果(纯CSS) (3D星空动画可以用作网页背景,Gary为文本文字) <!doctype html> <html lang=& ...

  5. JS框架_(JQuery.js)动画效果鼠标跟随

    百度云盘 传送门 密码 :4n9u 火狐浏览器上纯CSS_动画效果鼠标跟随效果: (作者:lily_lcj 传送门) <!DOCTYPE html PUBLIC "-//W3C//DT ...

  6. JS框架_(Typed.js)彩色霓虹灯发光文字动画

    百度云盘 传送门 密码:8oei 发光文字动画效果: <!doctype html> <html> <head> <meta charset="ut ...

  7. JS框架_(JQuery.js)夜晚天空满天星星闪烁动画

    百度云盘 传送门 密码:xftr 满天星星闪烁动画效果: (可用星空动画来作为页面背景,白色文字改为文章或者其他的O(∩_∩)O) <!doctype html> <html> ...

  8. JS框架_(Bootstrap.js)实现简单的轮播图

    Bootstrap框架中 轮播(Carousel)插件是一种灵活的响应式的向站点添加滑块的方式 轮播图效果: <!DOCTYPE html> <html> <head&g ...

  9. JS框架_(JQuery.js)文章全屏动画切换

    百度云盘 传送门 密码:anap 文章全屏动画切换效果 <!doctype html> <html lang="zh"> <head> < ...

随机推荐

  1. Hive 教程(一)-安装与配置解析

    安装就安装 ,不扯其他的 hive 依赖 在 hive 安装前必须具备如下条件 1. 一个可连接的关系型数据库,如 Mysql,postgresql 等,用于存储元数据 2. hadoop,并启动 h ...

  2. 二叉树的C++实现

    这是去年的内容,之前放在github的一个被遗忘的reporsity里面,今天看到了就拿出来 #include<iostream> #include<string> using ...

  3. 删库？半个DBA的跑路经验总结

    0. 国内呆不下了,赶紧出国 首先,不要选动车,要选最近的一班飞机,尽快出国,能走高速走高速,不然选人少的路线. 没错,我们 DBA 都是常备护照的. 切记,注意看高德地图实时路况. 我们有个前辈就是 ...

  4. Centos7下安装ZooKeeper

    1.下载源码 zookeeper 需要jdk的支持,需要先安装jdk 官网下载地址: http://mirrors.hust.edu.cn/apache/zookeeper/ 选择最新的版本进行下载 ...

  5. python django网站编程视频教程学习资料下载

    “人生苦短,我用python”,学python的小伙伴应该都了解这句话的含义.但是,学python,你真正了了解强大的Django框架吗!?据说Django还是由吉普赛的一个吉他手的名字命名的呢,有木 ...

  6. 学习.NET中的AppDomain

    学习.NET中的AppDomain 什么是AppDomain?AppDomain是一组程序集的逻辑容器,AppDomain是为了提供隔离而设计的.它提供了保护.配置和终止其中每一个应用程序的隔离 Ap ...

  7. vue 内存数组变化监听

    watch: { carts: { handler(val, oldVal) { subtotal(this.carts); console.log(this.carts) }, deep: true ...

  8. 26、Nginx Uwsgi代理

    1.Uwsgi代理基本概述 cgi.fastcgi.wsgi.uwsgi python框架 Django是一个开放源代码的web的框架 Flask是一个使用python编写的轻量级web应用框架 2 ...

  9. deep_learning_Function_tf.identity()

    这两天看batch normalization的代码时,学到滑动平均窗口函数ExponentialMovingAverage时,碰到一个函数tf.identity()函数,特此记录. tf.ident ...

  10. ERA-interim

    数据介绍整理中... https://software.ecmwf.int/wiki/display/UER/Time-integrated+surface+solar+radiation+downw ...