管理资源吧首页>>>教程>>>编程>>>Ajax教程>>>

PHP+AJAX无刷新实现返回天气预报数据

　　用php来写一个天气预报的模块

　　天气数据是通过采集中国气象网站的。本来中国天气网站也给出了数据的API接口。以下是API的地址。返回的数据格式为json格式。

　　1. http://www.weather.com.cn/data/sk/101010100.html

　　2. http://www.weather.com.cn/data/cityinfo/101010100.html

　　3. http://m.weather.com.cn/data/101010100.html

　　URL中的数字”101010100“是城市代码。所以可以先列出每个城市的城市代码，然后php程序接收到了城市代码，再去组装URL，在通过URL来显示该城市的实时天气。

　　index.php

　　

复制代码 代码如下:

　　<?php

　　header("Content-Type:text/html;charset=utf-8");

　　?>

　　<html>

　　<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

　　<head>

　　<title>weather forecast</title>

　　<script type="text/javascript" src="ajax.js"></script>

　　<script type="text/javascript">

　　function $(id){

　　return document.getElementById(id);

　　}

　　function getCityId(){

　　var http_request=createAjax();

　　var url="weatherforecast.php"

　　var data="cityid="+$("cityId").value;

　　http_request.onreadystatechange=getWetherInfo;

　　http_request.open("post",url,true);

　　http_request.setRequestHeader("Content-type","application/x-www-form-urlencoded");

　　http_request.send(data);

　　function getWetherInfo(){

　　if(http_request.readyState==4 && http_request.status==200){

　　var info=http_request.responseText;

　　$("weatherinfo").innerHTML=info;

　　}

　　}

　　}

　　</script>

　　</head>

　　<body>

　　<select name="cityId" onchange="getCityId();" id="cityId">

　　<option>--请选择城市--</option>

　　<option value="101010100">北京</option>

　　<option value="101020100">上海</option>

　　<option value="101030100">天津</option>

　　<option value="101040100">重庆</option>

　　<option value="101280101">广州</option>

　　</select>

　　<span id="weatherinfo"></span>

　　</body>

　　</html>

　　weatherforecast.php

　　

复制代码 代码如下:

　　<?php

　　header("Content-Type:text/html;charset=utf-8");

　　header("Cache-Control:no-cache");

　　if (isset($_POST['cityid'])){

　　$cityid=$_POST['cityid'];

　　$url=$url="http://www.weather.com.cn/data/sk/".$cityid.".html";

　　}else {

　　$url="http://www.weather.com.cn/data/sk/101010100.html";

　　}

　　$weatherInfo_json=file_get_contents($url);

　　$weatherInfo=json_decode($weatherInfo_json,true);

　　$cityName=$weatherInfo['weatherinfo']['city'];

　　$cityTemp=$weatherInfo['weatherinfo']['temp'];

　　$cityWd=$weatherInfo['weatherinfo']['WD'];

　　$cityWs=$weatherInfo['weatherinfo']['WS'];

　　$cityTime=$weatherInfo['weatherinfo']['time'];

　　$citySD=$weatherInfo['weatherinfo']['SD'];

　　echo $weatherinfo="城市名字：$cityName,气温：$cityTemp,风向：$cityWd";

　　?>

教程首页 更多教程