zoukankan      html  css  js  c++  java
  • PHP+AJAX无刷新返回天气预报

    AjaxJavaScript天气预报php天气预报,用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天气预报--www.jbxue.com</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";  
    ?>  
  • 相关阅读:
    BZOJ 3132: 上帝造题的七分钟 树状数组+差分
    PAT Advanced 1006 Sign In and Sign Out (25 分)
    PAT Advanced 1011 World Cup Betting (20 分)
    PAT Basic 1032 挖掘机技术哪家强 (20 分)
    PAT Basic 1028 人口普查 (20 分)
    PAT Basic 1004 成绩排名 (20 分)
    大数据数据库HBase(二)——搭建与JavaAPI
    PAT Advanced 1009 Product of Polynomials (25 分)(vector删除元素用的是erase)
    PAT Advanced 1002 A+B for Polynomials (25 分)(隐藏条件,多项式的系数不能为0)
    PAT Basic 1041 考试座位号 (15 分)
  • 原文地址:https://www.cnblogs.com/linuxnotes/p/3493438.html
Copyright © 2011-2022 走看看