ajax请求获取天气,7. jquery-ajax请求天气接口

绝地灬酷狼 2022-09-03 11:16 162阅读 0赞

Ajax请求

查询天气

// Ajax请求：一般在刷新页面中的局部数据时，会使用ajax请求。该请求不会去重新刷新或请求这个页面中的所有数据，而只是动态的修改一部分数据。

function getWeather() \{

// 通过ajax向天气接口发送请求

// $.get('url', '请求成功之后的回调函数');

// $.post('url', 'POST参数', '请求成功之后的回调函数');

$.ajax(\{

// 请求地址

// val()获取输入框中的内容。

url: 'http://api.map.baidu.com/telematics/v3/weather?location=' + $('input').val() + '&output=json&ak=TueGDhCvwI6fOrQnLM0qmXxY9N0OkOiQ&callback=?',

// 请求类型：GET/POST

type: 'GET',

// 请求参数，是一个字符串。

// data: '',

// 指定服务器返回的数据类型

dataType: 'json',

// 指定请求失败的回调函数

error: function (data, status) \{

console.log('请求失败：', status, data);

\},

// 请求成功的回调函数

success: function (data, status) \{

// 请求成功，得到json数据，解析json数据，将数据展示到页面中。

console.log('请求成功：', data);

var result = data\['results'\]\[0\];

var current\_city = result\['currentCity'\];

var pm25 = result\['pm25'\];

var weather\_data = result\['weather\_data'\]\[0\];

var weather = weather\_data\['weather'\];

var wind = weather\_data\['wind'\];

var tem = weather\_data\['temperature'\];

// 通过js给p标签赋值

$('.city').text(current\_city);

$('.pm').text(pm25);

$('.weather').text(weather);

$('.wind').text(wind);

$('.temperature').text(tem);

\},

// 发起请求的方式：同步(false)还是异步(true)

async: true

\});

\}

发表评论取消回复

表情：

评论列表（有 0 条评论，162人围观）

还没有评论，来说两句吧...

相关阅读

相关天气信息获取

文章目录前言一、api接口二、接口调用 1.查询省份代码 2.查询城市代码 3.查询城市天气总结

末蓝、/ 2022年10月27日 12:17/ 0 赞/ 260 阅读

相关 ajax请求获取天气,7. jquery-ajax请求天气接口

Ajax请求查询天气 // Ajax请求：一般在刷新页面中的局部数据时，会使用ajax请求。该请求不会去重新刷新或请求这个页面中的所有数据，而只是动态的修改一部分数据。

绝地灬酷狼/ 2022年09月03日 11:16/ 0 赞/ 163 阅读

相关借助cryptoJS , jsonp跨域，请求心知天气API ，获取天气信息

1. 介绍jsonp的原理 2. 介绍ajax异步使用jsonp 3. 通过加密方式获取心知天气数据 4. 介绍node使用cryptoJS 方式加密数据 5. 介绍

àì夳堔傛蜴生んèń/ 2022年07月14日 04:00/ 0 赞/ 153 阅读

相关 php获取天气

public function getWeather() { //方法1： $url = 'http://wthrcd

女爷i/ 2022年06月15日 03:36/ 0 赞/ 169 阅读

相关 SpringBoot 调用天气预报api接口获取天气数据（2）

ps: 这是对[SpringBoot 调用天气预报api接口获取天气数据（1）][SpringBoot _api_1]的代码改造，加入了redis,[Quartz][],th

喜欢ヅ旅行/ 2022年05月10日 02:20/ 0 赞/ 402 阅读

相关 SpringBoot 调用天气预报api接口获取天气数据（1）

附：[SpringBoot 调用天气预报api接口获取天气数据（2）][SpringBoot _api_2] 项目结构： ![70][] 通过城市的名字获取天气数据：

清疚/ 2022年05月10日 01:28/ 0 赞/ 1406 阅读

相关 Android 和风天气SDK获取天气

在编写app的时候遇到了记录天气的情况，所以将使用和风天气的过程记录下来。一、导入和风天气的jar包以及依赖 jar包的下载链接[https://dev.heweat

谁借莪１个温暖的怀抱￠/ 2022年01月14日 09:45/ 0 赞/ 362 阅读

相关 Android 和风天气SDK获取天气

在编写app的时候遇到了记录天气的情况，所以将使用和风天气的过程记录下来。一、导入和风天气的jar包以及依赖 jar包的下载链接[https://dev.heweat

布满荆棘的人生/ 2021年11月01日 23:40/ 0 赞/ 478 阅读

相关 ajax接口请求

<script type="text/javascript"> aaa() funct

超、凢脫俗/ 2021年09月30日 23:46/ 0 赞/ 386 阅读

相关 vue中请求天气数据（中国天气网),以及展示天气动态图标skyInco

获取天气 getWeather () { let city = "杭州" this.$axios .get

心已赠人/ 2021年08月29日 23:07/ 0 赞/ 1591 阅读