1 public ActionResult Index(string city) 2 { 3 4 5 if (string.IsNullOrEmpty(city)) 6 { 7 city = "上海"; 8 } 9 //ak需要自己到百度地图官网申请 10 Uri weatherInfo = new Uri("http://api.map.baidu.com/telematics/v3/weather?location=" + city + "&output=json&ak=UKMGHnstHCOFzYBe2h70gi5fLsc0C0dG"); 11 12 HttpWebRequest request = WebRequest.Create(weatherInfo) as HttpWebRequest; 13 List<WeatherData> weatherDataList = new List<WeatherData>(); 14 15 using (HttpWebResponse response = request.GetResponse() as HttpWebResponse) 16 { 17 // Get the response stream 18 StreamReader reader = new StreamReader(response.GetResponseStream()); 19 string json = reader.ReadToEnd(); 20 21 Weather model = JsonHelper.JsonToEntity<Weather>(json); 22 List<WeatherDto> weatherDtoList = new List<WeatherDto>(); 23 List<Index> indexList = new List<Index>(); 24 25 foreach (WeatherResult result in model.Results) 26 { 27 indexList = result.Index; 28 weatherDataList = result.Weather_Data; 29 } 30 for (int i = 0; i < indexList.Count; i++) 31 { 32 WeatherDto weatherDto = new WeatherDto(); 33 weatherDto.Des = indexList[i].Des; 34 weatherDto.Tipt = indexList[i].Tipt; 35 weatherDto.Title = indexList[i].Title; 36 weatherDto.Zs = indexList[i].Zs; 37 38 if (i < weatherDataList.Count) 39 { 40 weatherDto.Date = weatherDataList[i].Date; 41 weatherDto.DayPictureUrl = weatherDataList[i].DayPictureUrl; 42 weatherDto.NightPictureUrl = weatherDataList[i].NightPictureUrl; 43 weatherDto.Temperature = weatherDataList[i].Temperature; 44 weatherDto.Weather = weatherDataList[i].Weather; 45 weatherDto.Wind = weatherDataList[i].Wind; 46 47 } 48 weatherDtoList.Add(weatherDto); 49 } 50 } 51 52 return View("NewView",weatherDataList); 53 } 54 55 } 56 57 public class WeatherDto 58 { 59 public string Title { get; set; } 60 61 public string Zs { get; set; } 62 63 public string Tipt { get; set; } 64 65 public string Des { get; set; } 66 67 public string Date { get; set; } 68 69 public string DayPictureUrl { get; set; } 70 71 public string NightPictureUrl { get; set; } 72 73 public string Weather { get; set; } 74 75 public string Wind { get; set; } 76 77 public string Temperature { get; set; } 78 } 79 80 81 public class Weather 82 { 83 public string Error { get; set; } 84 85 public string Status { get; set; } 86 87 public string Date { get; set; } 88 89 public List<WeatherResult> Results { get; set; } 90 } 91 92 public class WeatherResult 93 { 94 public string CurrentCity { get; set; } 95 96 public string Pm25 { get; set; } 97 98 public List<Index> Index { get; set; } 99 100 public List<WeatherData> Weather_Data { get; set; } 101 }
1 @model IEnumerable<MvcAjaxTest.Models.WeatherData> 2 3 @{ 4 Layout = null; 5 } 6 7 <html> 8 <head> 9 <title>weather</title> 10 <link rel="shortcut icon" href="http://p8.qhimg.com/t0158c24c5ddb3a6745.png" type="image/x-icon"> 11 <link rel="stylesheet" href="~/Content/css/Weather.css" /> 12 <style type="text/css"> 13 #weathertype { 14 font-size: 28px; 15 padding-left: 20px; 16 } 17 18 #copyright { 19 padding: 40px 0; 20 text-align: center; 21 line-height: 2; 22 color: #999; 23 } 24 25 .btn-app { 26 background: url(http://p8.qhimg.com/t017399c8595fd6cc76.png) no-repeat 0 0; 27 } 28 29 .skinmore, .skinmore2 { 30 z-index: -1; 31 } 32 33 .skin2 .skinmore2 { 34 background: url(http://p4.qhimg.com/t0191e46e3e10bc96e3.png) repeat center 0; 35 height: 100%; 36 left: 0; 37 position: absolute; 38 top: 0; 39 100%; 40 } 41 42 .qrcodes img { 43 margin-top: 40px; 44 } 45 46 .qrcodes { 47 position: absolute; 48 top: 150px; 49 200px; 50 right: 2%; 51 } 52 53 .header { 54 height: 110px; 55 } 56 57 .logo { 58 background: url(http://p9.qhimg.com/t01c2da4dacc6c6dee8.png) no-repeat; 59 background-image: -webkit-image-set(url(http://p9.qhimg.com/t01c2da4dacc6c6dee8.png) 1x,url(http://p0.qhimg.com/t01ea0b4aedd360d174.png) 2x); 60 float: left; 61 height: 65px; 62 margin-top: 35px; 63 183px; 64 } 65 66 .search { 67 margin-top: 20px; 68 } 69 </style> 70 <script type="text/javascript" src="~/Scripts/jquery-1.8.2.js"></script> 71 <script type="text/javascript"> 72 function Change() { 73 var citySelected = $("#GetCity option:selected").text(); 74 $.ajax({ 75 type: "Post", 76 url: "Weather/Index", 77 data: { City: citySelected }, 78 success: function (data) { 79 $("#partRefresh").html(data); 80 }, 81 error: function () { 82 alert("请求失败，请稍候再试..."); 83 } 84 }); 85 } 86 87 </script> 88 89 </head> 90 <body class="skin6" style="display: block;"> 91 <div> 92 <select id="GetCity" onchange="Change()"> 93 <option value="1" selected="selected">上海市</option> 94 <option value="2">合肥市</option> 95 <option value="3">牡丹江市</option> 96 <option>湖州市</option> 97 <option>海口市</option> 98 </select> 99 </div> 100 <div class="morewether" id="partRefresh"> 101 <!-- 各天气对应中文拼音 如icon-yewanqing对应“夜晚晴“ --> 102 <ul id="foreast"> 103 <li> 104 <p class="colora">@Model.ToList()[0].Date</p> 105 <p class="icon-tu"><i class="icon-qing"></i><br>@Model.ToList()[0].Weather</p> 106 <p class="otherinfo"><span>@Model.ToList()[0].Temperature</span>@Model.ToList()[0].Wind</p> 107 </li> 108 <li> 109 <p class="colora">@Model.ToList()[1].Date</p> 110 <p class="icon-tu"><i class="icon-shachen"></i><br>@Model.ToList()[1].Weather</p> 111 <p class="otherinfo"><span>@Model.ToList()[1].Temperature</span>@Model.ToList()[1].Wind</p> 112 </li> 113 <li> 114 <p class="colora">@Model.ToList()[2].Date</p> 115 <p class="icon-tu"><i class="icon-shachen"></i><br>@Model.ToList()[2].Weather</p> 116 <p class="otherinfo"><span>@Model.ToList()[2].Temperature</span>@Model.ToList()[2].Wind</p> 117 </li> 118 <li> 119 <p class="colora">@Model.ToList()[3].Date</p> 120 <p class="icon-tu"><i class="icon-shachen"></i><br>@Model.ToList()[3].Weather</p> 121 <p class="otherinfo"><span>@Model.ToList()[3].Temperature</span>@Model.ToList()[3].Wind</p> 122 </li> 123 </ul> 124 </div> 125 </body> 126 </html>
效果图：