ajax 网络,ajax请求网络api

不啰嗦，直接上代码：

1、在浏览器输入网址：http://api.asilu.com/weather/?callback=getname&city=深圳

你会看到如下结果：他返回的是json数据

/** api.asilu.com **/getname({"city":"深圳","pm25":"28","weather":[{"date":"周一 09月10日","icon1":"day\/duoyun","icon2":"night\/duoyun","weather":"多云","wind":"无持续风向微风","temp":"31 ~ 25℃"},{"date":"周二","icon1":"day\/duoyun","icon2":"night\/duoyun","weather":"多云","wind":"无持续风向微风","temp":"31 ~ 27℃"},{"date":"周三","icon1":"day\/leizhenyu","icon2":"night\/leizhenyu","weather":"雷阵雨","wind":"东风4-5级","temp":"31 ~ 26℃"},{"date":"周四","icon1":"day\/zhenyu","icon2":"night\/zhenyu","weather":"阵雨","wind":"东风3-4级","temp":"30 ~ 26℃"}],"date":"2018-09-10","id":"101280601","t":1536508800});

整理之后是这样的：

/** api.asilu.com **/

getname({

"city": "深圳",

"pm25": "28",

"weather": [{

"date": "周一 09月10日",

"icon1": "day\/duoyun",

"icon2": "night\/duoyun",

"weather": "多云",

"wind": "无持续风向微风",

"temp": "31 ~ 25℃"

}, {

"date": "周二",

"icon1": "day\/duoyun",

"icon2": "night\/duoyun",

"weather": "多云",

"wind": "无持续风向微风",

"temp": "31 ~ 27℃"

}, {

"date": "周三",

"icon1": "day\/leizhenyu",

"icon2": "night\/leizhenyu",

"weather": "雷阵雨",

"wind": "东风4-5级",

"temp": "31 ~ 26℃"

}, {

"date": "周四",

"icon1": "day\/zhenyu",

"icon2": "night\/zhenyu",

"weather": "阵雨",

"wind": "东风3-4级",

"temp": "30 ~ 26℃"

}],

"date": "2018-09-10",

"id": "101280601",

"t": 1536508800

});

2、怎样才能获取上述json的数据呢？很简单：

ajax

天气查询

确定

$(function(){

$('#ajax').on('click',function(){

var $telvalue=$('#tel').val();

if($telvalue=="") {

alert('不能为空！');

return;

}

$.ajax({

type: 'get',

datatype:'jsonp',

url: 'http://api.asilu.com/weather/?callback=getname&city='+$telvalue,

success: function(data){

var reslutdata=data;

console.log(reslutdata);

$('#reslut').text("你查询的是:"+reslutdata.city+","+"明天的天气是:"+reslutdata.weather[0].weather);

}

})

})

})

3、效果图是这样的：

4、完毕。