JQuery obtains the Weather API instance code

1, backstage
<?php
if (Isset ($_get[' city ')) && $_get[' city ']!= ')
{
$url = ' http://m.weather.com.cn/data/';
$city = (int) $_get[' city '];
$json = file_get_contents ($url. $city. ') HTML ');
Echo $json;
Exit
}

Gets the weather data for the http://m.weather.com.cn/data/and returns the JSON format data.

2. Front Desk

The returned JSON data:

Weatherinfo:
{
City: "Hangzhou"
City_en: "Hangzhou"
Cityid: "101210101"
Date: ""
Date_y: "August 12, 2012"
Fchh: "18"
FL1: "Less than Level 3"
FL2: "Less than Level 3"
FL3: "Less than Level 3"
FL4: "Less than Level 3"
FL5: "Less than Level 3"
FL6: "Less than Level 3"
FX1: "The Breeze"
FX2: "The Breeze"
IMG1: "1"
IMG2: "4"
IMG3: "1"
IMG4: "99"
IMG5: "1"
IMG6: "4"
Img7: "0"
Img8: "1"
IMG9: "0"
IMG10: "1"
IMG11: "1"
IMG12: "99"
Img_single: "4"
Img_title1: "Cloudy"
Img_title2: "Thunderstorm"
Img_title3: "Cloudy"
Img_title4: "Cloudy"
Img_title5: "Cloudy"
Img_title6: "Thunderstorm"
Img_title7: "Clear"
Img_title8: "Cloudy"
Img_title9: "Clear"
Img_title10: "Cloudy"
IMG_TITLE11: "Cloudy"
Img_title12: "Cloudy"
Img_title_single: "Thunderstorm"
Index: "Hot"
index48: "Hot"
Index48_d: "Hot weather, suggest a blouse, short skirts, shorts, thin t-shirts, open collar short-sleeved cotton shirts and other cool summer clothing." "
INDEX48_UV: "Medium"
Index_ag: "More easy to send"
INDEX_CL: "More unfavorable"
Index_co: "It's not comfortable."
Index_d: "Hot weather, suggest a blouse, short skirts, shorts, thin t-shirts, open collar short-sleeved cotton shirts and other cool summer clothing." "
Index_ls: "Not suitable"
INDEX_TR: "General"
INDEX_UV: "Medium"
INDEX_XC: "Not suitable"
St1: "34"
ST2: "26"
ST3: "36"
ST4: "26"
ST5: "33"
ST6: "27"
Temp1: "26℃~35℃"
TEMP2: "27℃~35℃"
Temp3: "27℃~35℃"
Temp4: "28℃~35℃"
TEMP5: "28℃~36℃"
TEMP6: "28℃~35℃"
TempF1: "78.8?~95?"
TempF2: "80.6?~95?"
TempF3: "80.6?~95?"
TempF4: "82.4?~95?"
TempF5: "82.4?~96.8?"
TempF6: "82.4?~95?"
Weather1: "Cloudy Turn Thunderstorm"
Weather2: "Cloudy"
Weather3: "Cloudy Turn Thunderstorm"
Weather4: "Sunny Turn Cloudy"
Weather5: "Sunny Turn Cloudy"
WEATHER6: "Cloudy"
Week: "Sunday"
Wind1: "The Breeze"
Wind2: "The Breeze"
Wind3: "The Breeze"
Wind4: "The Breeze"
Wind5: "The Breeze"
Wind6: "The Breeze"
}

Example

<! DOCTYPE html>
<meta charset= "Utf-8"/>
<title>weather api</title>
<style type= "Text/css" >
*
{
padding:0;margin:0;font-family: Microsoft Ya-hei;
}
Div
{
Clear:both;
}
Li
{
List-style:none;
margin-right:20px;
line-height:24px;
Float:left;
width:300px;
Text-align:center;
}
Li Span
{
margin-right:10px;
}
</style>
<script type= "Text/javascript" src= ". /public/jquery.js "></script>
<script type= "Text/javascript" >
$ (function ()
{
var $div _1=$ (' #div-1 ');
var $div _2=$ (' #div-2 ');
var $btn =$ (' Input:button ');
$btn. Click (Function ()
{
$ (this). fadeout (100);
Get_weather ();
});
function Get_weather ()
{
$.ajax (
{
URL: ' _weather.php ',
data:{city:101210101},//Hangzhou
Type: ' Get ',
DataType: ' JSON ',
Beforesend:function ()
{
$div _2.html (' Getting Hangzhou weather <span>.</span> ');
var str= '.,..,...,....,.....,...... ';
var a=str.split (', ');
var i=0;
_t=setinterval (function ()
{
i++;
I= (i>5) 0:i;
$div _2.find (' span '). HTML (a[i]);
},300);
},
Success:function (JSON)
{
var w=json.weatherinfo;
Html_1= ';
var a=[];
A[0]= ' Today's weather ';
A[1]= ' tomorrow's weather ';
a[2]= ' Day weather ';

for (Var i=0;i<=2;i++)
{
m=i*2+1;
n=i*2+2;
html_1+= ' <li><strong> ' +a[i]+ ':</strong><br/> ';
for (j=m;j<=n;j++)
{
html_1+= ' <span>+eval ("w.img" +j) + '. gif "alt="
+eval ("W.img_title" +j) + ' title= '
+eval ("W.img_title" +j) + '/> '
+ ' </span> ';
}
html_1+= ' <br/> ';
for (j=m;j<=n;j++)
{
html_1+= ' <span> ' +eval ("W.weather" +j) + ' </span> ';
}
html_1+= ' </li> ';
}
$div _1.html (Html_1);
Clearinterval (_t);
$div _2.html (' Weather data acquisition complete! ');
},
Error:function ()
{
Clearinterval (_t);
$div _2.html (' Get the weather failed! ');
$btn. FadeIn (100);
}
});
}
Get_weather ();
});
</script>
<input type= "button" value= "Retrieve weather Data" style= "Display:none;" >
<div id= "Div-1" ></div>
<div id= "Div-2" ></div>