Background code:
[HttpPost] Public stringAjaxweather () {stringCityName =string. IsNullOrEmpty (request.form[" City"]) ?"": request.form[" City"]. ToString ();//Get city Name if(cityname!="") { stringWeatherinfo = HttpGet (string. Format ("http://api.map.baidu.com/telematics/v3/weather?location={0}&output=json&ak= 8f6d52bdd67cfe7b6c3db91adb29a51b", Httputility.urlencode (CityName))); returnWeatherinfo;//return JSON } Else { return ""; } }
#regionHttpGet/// <summary> ///Get method Fetch information/// </summary> /// <param name= "Url" ></param> /// <param name= "Postdatastr" ></param> /// <returns></returns> Public stringHttpGet (stringUrl) {HttpWebRequest Request=(HttpWebRequest) webrequest.create (URL); Request. Method="GET"; Request. ContentType="Text/html;charset=utf-8"; HttpWebResponse Response=(HttpWebResponse) request. GetResponse (); Stream Myresponsestream=Response. GetResponseStream (); StreamReader Mystreamreader=NewStreamReader (Myresponsestream, System.Text.Encoding.GetEncoding ("Utf-8")); stringRetString =Mystreamreader.readtoend (); Mystreamreader.close (); Myresponsestream.close (); returnretstring; } #endregion
JSON content:
1 {2 "error": 0,3 " status": "Success",4 "date": "2015-04-28",5 "Results": [6 {7 " currentcity": "Harbin",8 " pm25": " the",9 "index": [Ten { One " title": "Dressing", A " Zs": "Comfortable", - " tipt": "Dressing index", - " des": "Recommended long-sleeved T-shirts, shirts and trousers and other clothing." The frail and infirm are advised to knit long-sleeved shirts, vests and trousers. " the }, - { - " title": "Car Wash", - " Zs": "More appropriate", + " tipt": "Car Wash index", - "des": "more suitable for car washing, the next day without rain, the wind is small, scrub a new car can at least maintain a day." " + }, A { at " title": "Travel", - " Zs": "Fit", - " Tipt": "Tourism Index", - " des": "The weather is good, the temperature is suitable, but the wind is a little bit big." This weather is suitable for travel, you can enjoy the infinite scenery of nature. " - }, - { in " title": "Cold", - " Zs": "Less Hair", to " Tipt": "Cold index", + " des": "The weather conditions are suitable, no obvious cooling process, the incidence of colds is low." " - }, the { * " title": "Movement", $ " Zs": "More appropriate",Panax Notoginseng " tipt": "Movement Index", - " des": "good weather, but considering the strong wind and low temperature, it is recommended that you do indoor sports, if you are outdoors, please pay attention to wind and appropriate increase and decrease clothing." " the }, + { A " title": "UV intensity", the "ZS": "Medium", + " tipt": "UV Intensity index", - "des": "is a medium-intensity ultraviolet radiation weather, recommended to wear SPF above 15, pa+ sunscreen skin care products, hats, sunglasses. " $ } $ ], - "Weather_data": [ - { the " Date": "Tuesday April 28 (Real time: 25 ℃)", - " Daypictureurl": "Http://api.map.baidu.com/images/weather/day/duoyun.png",Wuyi " Nightpictureurl": "Http://api.map.baidu.com/images/weather/night/qing.png", the " Weather": "Cloudy Turn Clear", - "Wind ": "Southwest Wind Level 3-4", Wu " Temperature": "28 ~ 13 ℃" - }, About { $ " Date": "Wednesday", - " Daypictureurl": "Http://api.map.baidu.com/images/weather/day/qing.png", - " Nightpictureurl": "Http://api.map.baidu.com/images/weather/night/duoyun.png", - " Weather": "Sunny Turn cloudy", A " Wind": "Southerly 4-5 level", + " Temperature": "31 ~ 16 ℃" the }, - { $ " Date": "Thursday", the " Daypictureurl": "Http://api.map.baidu.com/images/weather/day/qing.png", the " Nightpictureurl": "Http://api.map.baidu.com/images/weather/night/duoyun.png", the " Weather": "Sunny Turn cloudy", the " Wind": "Westerly Level 3-4", - " Temperature": "26 ~ 15 ℃" in }, the { the " Date": "Friday", About " Daypictureurl": "Http://api.map.baidu.com/images/weather/day/zhenyu.png", the " Nightpictureurl": "Http://api.map.baidu.com/images/weather/night/zhenyu.png", the " Weather": "Showers", the "Wind ": "Southwest Wind Level 3-4", + " Temperature": "25 ~ 12 ℃" - } the ]Bayi } the ] the}
View Code
HTML code:
Name:<id= "City" name=" urban" type= "Text" value= "@ViewBag. City">
jquery HTML Container <id= "weatherhtml"></div>
jquery Code:
<script type= "Text/javascript" > $(function() {Weather (); }); functionWeather () {var_city = $ ("#city"). Val (); $.post ('/webapi/ajaxweather ', {city: _city},function(Result) {//alert (result); varDataobj = eval (' (' + result + ') '); varhtml = ' '; if(Dataobj.status = ' success ') {$.each (dataobj.results,function(idx, item) {HTML+ = ' <div> City name: ' + item.currentcity + ' </div> '; HTML+ = ' <div>pm2.5: ' + item.pm25 + ' </div> '; HTML+ = ' <table> '; $.each (Item.index,function(IDX2, item2) {HTML+ = ' <tr> '; HTML+ = ' <td> ' + item2.tipt + ' </td> '; HTML+ = ' <td> ' + item2.title + ' </td> '; HTML+ = ' <td> ' + Item2.zs + ' </td> '; HTML+ = ' <td> ' + item2.des + ' </td> '; HTML+ = ' </tr> '; }); HTML+ = ' </table> '; HTML+ = ' <table> '; $.each (Item.weather_data,function(idx3, item3) {HTML+ = ' <tr> '; HTML+ = ' <td> ' + item3.date + ' </td> '; HTML+ = ' <td></td> '; HTML+ = ' <td></td> '; HTML+ = ' <td> ' + item3.weather + ' </td> '; HTML+ = ' <td> ' + item3.wind + ' </td> '; HTML+ = ' <td> ' + item3.temperature + ' </td> '; HTML+ = ' </tr> '; }); HTML+ = ' </table> '; }); } $("#WeatherHtml"). HTML (HTML); }); }</script>
Ajax way to call Baidu weather