js 代表处级联出省份、市数据关联 （js+c#代码）

功能描述：选取的代表处， 对应的省份自动关联出来，市区根据关联出来的省份关联出来对应的市 

效果如下：

html展示：

<tr> 
                            <td text-align: center"><span class="SearchLable">代表处：</span></td>
                            <td>
                                <select id="region" class="form-control required" onchange="GetProvidence1()" style="height: 34px; width:200px; ">
                                    <option value="">--SELECT--</option>
                                    @foreach (var item in smsbaseregionlist)
                                    {
                                        <option [email protected]>@item.REGIONNAME</option>
                                    }
                                </select>
                            </td>


                            <td text-align: center"><span class="SearchLable">省份：</span></td>
                            <td>
                                <select id="citys" class="form-control required" onchange="GetCity()" style="height: 34px; width:200px;">
                                    <option value="">--SELECT--</option>
                                </select>
                            </td>
                            <td text-align: center"><span class="SearchLable">城市：</span></td>
                            <td>
                                <select id="CityID" class="form-control required" style="height: 34px;width:200px; ">
                                    <option value="">--SELECT--</option>
                                </select>
                            </td>
                        </tr>

级联的js:

    //级联出省份
    function GetProvidence1() {
        var regionid = $("#region option:selected").val();
        if (regionid == "" || regionid == null) {
            $("#ProvidenceID").empty();
            var strp = "<option value=\"\">--SELECT--</option>";
            $("#ProvidenceID").html(strp);

            $("#CityID").empty();
            var strc = "<option value=\"\">--SELECT--</option>";
            $("#CityID").html(strc);
            return false;
        }
        else {
            $.ajax({
                type: "POST",
                data: { regionid: regionid },
                url: "GetProvidencelist",
                dataType: "JSON",
                success: function (_data) {
                    $("#citys").empty();
                    var str = "<option value=\"\">--SELECT--</option>";
                    if (_data.length == 1) {
                        for (var item in _data) {
                            str += "<option selected=\"selected\" value=\"" + _data[item].PROVINCEID + "\">" + _data[item].PROVINCENAME + "</option>";
                            GetCity1(_data[item].REGIONID, _data[item].PROVINCEID);
                        }
                    }
                    else {
                        for (var item in _data) {
                            str += "<option value=\"" + _data[item].PROVINCEID + "\">" + _data[item].PROVINCENAME + "</option>";
                        }
                        var strc = "<option value=\"\">--SELECT--</option>";
                        $("#CityID").html(strc);
                    }
                    $("#citys").html(str);

                }
            });
        }
    }


    //级联出城市
    function GetCity() {
        var regionid = $("#region option:selected").val();
        var procidenceid = $("#citys option:selected").val();
        if (procidenceid == "" || procidenceid == null) {
            $("#CityID").empty();
            var strp = "<option value=\"\">--SELECT--</option>";
            $("#CityID").html(strp);
            return false;
        }
        else {
            $.ajax({
                type: "POST",
                data: { procidenceid: procidenceid, regionid: regionid },
                url: "GetCitylist",
                dataType: "JSON",
                success: function (_data) {
                    $("#CityID").empty();
                    var str = "<option value=\"\">--SELECT--</option>";
                    for (var item in _data) {
                        str += "<option value=\"" + _data[item].CITYID + "\">" + _data[item].CITYNAME + "</option>";
                    }
                    $("#CityID").html(str);
                }
            });
        }
    }

    //级联出城市
    function GetCity1(regionid, procidenceid) {
        if (procidenceid == "" || procidenceid == null) {
            $("#CityID").empty();
            var strp = "<option value=\"\">--SELECT--</option>";
            $("#CityID").html(strp);
            return false;
        }
        else {
            $.ajax({
                type: "POST",
                data: { procidenceid: procidenceid, regionid: regionid },
                url: "GetCitylist",
                dataType: "JSON",
                success: function (_data) {
                    $("#CityID").empty();
                    var str = "<option value=\"\">--SELECT--</option>";
                    for (var item in _data) {
                        str += "<option value=\"" + _data[item].CITYID + "\">" + _data[item].CITYNAME + "</option>";
                    }
                    $("#CityID").html(str);
                }
            });
        }
    }

以上js调用的 c# 代码 （提供参考）mvc：

#region    代表处省市区县级联模块
		/// <summary>
		/// 获取省份根据代表处
		/// </summary>
		/// <returns></returns>
		public ContentResult GetProvidencelist()
		{
			decimal regionid = decimal.Parse(Request["regionid"]);
			List<SMS_BASE_AREA> areaproviencelist = DBAction<SMS_BASE_AREA>.LoadEntities().Where(o => o.REGIONID == regionid && o.ISVALID == "1" && o.AREALEVEL == 1).ToList();
			if (areaproviencelist.Count == 0)
			{
				areaproviencelist = DBAction<SMS_BASE_AREA>.LoadEntities().Where(o => o.REGIONID == regionid && o.ISVALID == "1" && o.AREALEVEL == 2).ToList();
				List<SMS_BASE_AREA> areaproviencelist1 = new List<SMS_BASE_AREA>();
				foreach (var item in areaproviencelist)
				{
					if (areaproviencelist1.Where(o => o.PROVINCENAME == item.PROVINCENAME).Count() == 0)
					{
						areaproviencelist1.Add(item);
					}
				}
				areaproviencelist = areaproviencelist1;
			}
			return Content(JsonConvert.SerializeObject(areaproviencelist));
		}

		/// <summary>
		/// 获取城市根据省份
		/// </summary>
		/// <returns></returns>
		public ContentResult GetCitylist()
		{
			string regionidstr = Request["regionid"];
			decimal regionid = regionidstr == null ? 0 : decimal.Parse(regionidstr);
			string procidenceid = Request["procidenceid"];
			List<SMS_BASE_AREA> areacitylist = DBAction<SMS_BASE_AREA>.LoadEntities().Where(o => o.PROVINCEID == procidenceid && o.ISVALID == "1" && o.AREALEVEL == 2).ToList();
			if (!string.IsNullOrWhiteSpace(regionidstr))
			{
				areacitylist = DBAction<SMS_BASE_AREA>.LoadEntities().Where(o => o.REGIONID == regionid && o.PROVINCEID == procidenceid && o.ISVALID == "1" && o.AREALEVEL == 2).ToList();
			}
			return Content(JsonConvert.SerializeObject(areacitylist));
		}
		/// <summary>
		/// 获取区县根据城市
		/// </summary>
		/// <returns></returns>
		public ContentResult GetDistrictlist()
		{
			string cityid = Request["cityid"];
			List<SMS_BASE_AREA> areadistrictlist = DBAction<SMS_BASE_AREA>.LoadEntities().Where(o => o.CITYID == cityid && o.ISVALID == "1" && o.AREALEVEL == 3).ToList();
			return Content(JsonConvert.SerializeObject(areadistrictlist));
		}
		#endregion