PHP+AJAX無(wú)刷新實(shí)現(xiàn)返回天氣預(yù)報(bào)數(shù)據(jù)
天氣數(shù)據(jù)是通過(guò)采集中國(guó)氣象網(wǎng)站的。本來(lái)中國(guó)天氣網(wǎng)站也給出了數(shù)據(jù)的API接口。以下是API的地址。返回的數(shù)據(jù)格式為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中的數(shù)字”101010100“是城市代碼。所以可以先列出每個(gè)城市的城市代碼,然后php程序接收到了城市代碼,再去組裝URL,在通過(guò)URL來(lái)顯示該城市的實(shí)時(shí)天氣。
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>--請(qǐng)選擇城市--</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,風(fēng)向:$cityWd";
?>
- PHP調(diào)用API接口實(shí)現(xiàn)天氣查詢功能的示例
- PHP微信開(kāi)發(fā)之查詢城市天氣
- php使用百度天氣接口示例
- PHP實(shí)現(xiàn)采集中國(guó)天氣網(wǎng)未來(lái)7天天氣
- php結(jié)合飛信 免費(fèi)天氣預(yù)報(bào)短信
- PHP 獲取指定地區(qū)的天氣實(shí)例代碼
- php實(shí)現(xiàn)的百度搜索某地天氣的小偷代碼
- PHP Ajax JavaScript Json獲取天氣信息實(shí)現(xiàn)代碼
- php采集自中央氣象臺(tái)范圍覆蓋全國(guó)的天氣預(yù)報(bào)代碼實(shí)例
- php微信開(kāi)發(fā)之百度天氣預(yù)報(bào)
- PHP調(diào)用全國(guó)天氣預(yù)報(bào)數(shù)據(jù)接口查詢天氣示例
相關(guān)文章
ajax session過(guò)期問(wèn)題的幾個(gè)解決方案
現(xiàn)在web開(kāi)發(fā)中,ajax應(yīng)用的比較多。關(guān)于此方面的框架也不少。在應(yīng)用中都會(huì)遇到session過(guò)期的問(wèn)題2009-07-07ajax跨域獲取網(wǎng)站json數(shù)據(jù)的實(shí)例
下面小編就為大家分享一篇ajax跨域獲取網(wǎng)站json數(shù)據(jù)的實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2017-12-12ajax實(shí)現(xiàn)文件異步上傳并回顯文件相關(guān)信息功能示例
這篇文章主要介紹了ajax實(shí)現(xiàn)文件異步上傳并回顯文件相關(guān)信息功能,結(jié)合實(shí)例形式分析了基于jQuery $.ajax方法的文件異步上傳以及后臺(tái)java程序?qū)ξ募畔⒌淖x取與顯示相關(guān)操作技巧,需要的朋友可以參考下2018-06-06django使用ajax post數(shù)據(jù)出現(xiàn)403錯(cuò)誤如何解決
在django中,使用jquery ajax post數(shù)據(jù),會(huì)出現(xiàn)403的錯(cuò)誤,該如何解決呢?下面由腳本之家小編幫大家解決django使用ajax post數(shù)據(jù)出現(xiàn)403錯(cuò)誤,需要的朋友可以參考下2015-09-09Ajax動(dòng)態(tài)為下拉列表添加數(shù)據(jù)的實(shí)現(xiàn)方法
這篇文章主要介紹了Ajax動(dòng)態(tài)為下拉列表添加數(shù)據(jù)的實(shí)現(xiàn)方法,需要的朋友可以參考下2017-01-01ajaxrequest.js ajaxrequest 0.7最新版 使用AJAXRequest進(jìn)行AJAX應(yīng)用程序開(kāi)發(fā)入
ajaxrequest.js ajaxrequest 0.7最新版 使用AJAXRequest進(jìn)行AJAX應(yīng)用程序開(kāi)發(fā)入門(mén)小技巧...2007-12-12js跨域調(diào)用WebService的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇js跨域調(diào)用WebService的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-09-09ajax實(shí)現(xiàn)session不過(guò)期(避免頁(yè)面過(guò)期的現(xiàn)象)
在寫(xiě)博客時(shí)要寫(xiě)好長(zhǎng)時(shí)間但沒(méi)有出現(xiàn)這種情況并且有實(shí)時(shí)的自動(dòng)保存;這就涉及到了session的過(guò)期時(shí)間問(wèn)題,下面與大家分享下具體的實(shí)現(xiàn)方法2013-06-06.NET2.0環(huán)境下的Ajax選型和應(yīng)用(提供Demo源碼下載)
.NET2.0環(huán)境下的Ajax選型和應(yīng)用(提供Demo源碼下載)...2007-05-05