PHP ajax achieves no refresh to obtain weather status_PHP tutorial

First of all, we must understand that we cannot do weather forecasting by ourselves. Here we only need to call the data returned by the API interface. The following is an example of calling the API interface of China Weather Network for us to learn together. Weather has become an indispensable topic in life and is closely related to our lives. On the right side of my blog, I made a small weather query module using php+ajax.

The ideal state should be for users to automatically obtain local weather information based on different places they visit. However, the technology is currently limited and can only be completed manually. This is much simpler and does not use too many technologies. It mainly uses ajax to call an open interface and then processes the returned json data.

Interface address: http://www.weather.com.cn/data/cityinfo/101200101.html

Returned value: {"weatherinfo":{"city":"Wuhan","cityid":"101200101","temp1":"28℃","temp2":"36℃", "weather":"Sunny to cloudy","img1":"n0.gif","img2":"d1.gif","ptime":"18:00"}}

The interface address part is "101200101". This string of ID numbers is the city ID. I went to Baidu to get the ID corresponding to the city, and then encapsulated it into an array. When using it, just call it directly. There is not much core code, mainly cities - IDs are relatively large, so I won’t post the source code, just package it and share it. Friends who need it can download it directly!

Part of the code

The code is as follows

Copy code

代码如下

复制代码

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="jquery.js" ></script> <script type="text/javascript"> $(function(){    $("#submit").click(function(){   //发送ajax请求   var city = $("#city").val();   $.post("getweather.php", {city:city}, function(data){    if(data.weatherinfo.city){     var city = data.weatherinfo.city;   //城市名称     var temp1 = data.weatherinfo.temp1;  //最高气温     var temp2 = data.weatherinfo.temp2;  //最低气温     var weather = data.weatherinfo.weather;  //天气描述（“晴到多云”）     alert(city+":"+weather+","+temp2+"-"+temp1);      return;    }else{     alert("没找到该城市");    }   },"json");  });   }); </script>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="jquery.js" ></script> <script type="text/javascript"> $(function(){ $("#submit").click(function(){ //Send ajax request var city = $("#city").val(); $.post("getweather.php", {city:city}, function(data){ If(data.weatherinfo.city){ var city = data.weatherinfo.city; //City name var temp1 = data.weatherinfo.temp1; //Maximum temperature var temp2 = data.weatherinfo.temp2; //Minimum temperature var weather = data.weatherinfo.weather; //Weather description ("sunny to cloudy") alert(city+":"+weather+","+temp2+"-"+temp1); Return; }else{ alert("City not found"); } },"json"); }); }); </script>

getweather.php文件

 代码如下

复制代码

代码如下	复制代码
<form method="post">  请输入城市：<input type="text" name="city" id="city" value="武汉" />  <input type="button" name="sub" id="submit" value="查看天气" /> </form> 为、<?php include "citycode.php"; $city = $_POST['city']; $citycode = @$citycode[$city]; //echo "shibushi"; if(empty($citycode)){ echo "您输入的城市不在范围内"; }else{ echo file_get_contents("http://www.weather.com.cn/data/cityinfo/".$citycode.".html"); } ?>

<form method="post">
 请输入城市：<input type="text" name="city" id="city" value="武汉" />
 <input type="button" name="sub" id="submit" value="查看天气" />
</form>

为、<?php

 include "citycode.php";
 $city = $_POST['city'];
 $citycode = @$citycode[$city];
 //echo "shibushi";
 if(empty($citycode)){
  echo "您输入的城市不在范围内";
 }else{
  echo file_get_contents("http://www.weather.com.cn/data/cityinfo/".$citycode.".html");
 }
?>

测试效果

源码下载：php ajax实现无刷新获取天气状态源码下载:

  http://www.bkjia.com/PHPjc/633117.htmlwww.bkjia.comtruehttp://www.bkjia.com/PHPjc/633117.html

TechArticle

首先我们要明白一点我们自己是无法来做天气预报这种功能的，这里我们只要调用api接口返回的数据就可以了，下面是以中国天气网的api接...