三级联动使用Jquery实现城市三级数据联动的实例.docVIP

三级联动 使用Jquery实现城市三级数据联动的实例.txt21春暖花会开！如果你曾经历过冬天，那么你就会有春色！如果你有着信念，那么春天一定会遥远；如果你正在付出，那么总有一天你会拥有花开满圆。使用Jquery实现城市三级数据联动的实例 View: script type=text/javascript $(document).ready(function() { GetByJquery(); $(#ddlProvince).change(function() { GetCity() }); $(#ddlCity).change(function() { GetDistrict() }); }); function GetByJquery() { $(#ddlProvince).empty(); //清空省份SELECT控件 $.getJSON(/ajax/GetProvinceList, function(data) { $.each(data, function(i, item) { $(option/option) .val(item[ProvinceID]) .text(item[ProvinceName]) .appendTo($(#ddlProvince)); }); GetCity(); }); } function GetCity() { $(#ddlCity).empty(); //清空城市SELECT控件 var url =/ajax/GetCityList/ + $(#ddlProvince).val(); $.getJSON(url, function(data) { $.each(data, function(i, item) { $(option/option) .val(item[CityID]) .text(item[CityName]) .appendTo($(#ddlCity)); }); GetDistrict(); }); } function GetDistrict() { $(#ddlDistrict).empty(); //清空市区SELECT控件 var url = /ajax/GetDistrictList/ + $(#ddlCity).val(); $.getJSON(url, function(data) { $.each(data, function(i, item) { $(option/option) .val(item[DistrictID]) .text(item[DistrictName]) .appendTo($(#ddlDistrict)); }); }); } /script tabletrtdselect id=ddlProvince//tdtdselect id=ddlCity//tdtdselect id=ddlDistrict //td/tr/table Controller : using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; using System.Web.Mvc.Ajax; namespace MvcBBS.Controllers { public class AjaxController : Controller { // // GET: /Ajax/ /