1 <%@ Control Language="C#" AutoEventWireup="true" CodeFile="WUCCity.ascx.cs" Inherits="WUCCity" %>
 2 
 3 
 4 <script src="Common.js" type="text/javascript"></script>
 5 <script  type="text/javascript" >
 6     //创建异步对象
 7     var xhr = false;
 8     window.onload = function () {
 9 
10         xhr = createXhr(); //创建异步对象
11         loadPros(); //加载省下拉框数据
12         document.getElementById("selP").onchange = selectePro; //为省下拉框指定 onchange事件
13 
14     }
15 
16     //根据省ID获得市下拉框数据
17     function selectePro() {
18         //获得省ID
19         var proId = document.getElementById("selP").value;
20         xhr.open("get", "WUCCity.ashx?type=c&pid=" + proId, true);
21         xhr.setRequestHeader("If-Modified-Since", "0");
22         xhr.onreadystatechange = function () {
23             if (xhr.readyState == 4) {
24                 if (xhr.status == 200) {
25                     var res = xhr.responseText;
26                     //将返回的json数组字符串 转成 js 数组对象
27                     var jsonArr = eval(res);
28                     var selCity = document.getElementById("selC");
29                     //alert("jsonArr=" + jsonArr[0].AName);
30                     selCity.options.length = 0;
31                     for (var i = 0; i < jsonArr.length; i++) {
32                         selCity.options[i] = new Option(jsonArr[i].AName, jsonArr[i].AID);
33                     }
34                 }
35             }
36         }
37         xhr.send(null);
38     }
39     //加载省数据
40     function loadPros() {
41 
42         xhr.open("get", "WUCCity.ashx?type=p", true);
43         xhr.setRequestHeader("If-Modified-Since", "0");
44         xhr.onreadystatechange = function () {
45             if (xhr.readyState == 4) {
46                 if (xhr.status == 200) {
47                     var res = xhr.responseText;
48                     //将返回的json数组字符串 转成 js 数组对象
49                     var jsonArr = eval(res);
50                     var selPro = document.getElementById("selP");
51                     //alert("jsonArr=" + jsonArr[0].AName);
52                     for (var i = 0; i < jsonArr.length; i++) {
53                         selPro.options[i] = new Option(jsonArr[i].AName, jsonArr[i].AID);
54                     }
55                 }
56             }
57         }
58         xhr.send(null);
59     }
60 
61 
62 </script>
63 
64 <span id="WUCCity">
65    省：<select id ="selP" style="width: 92px">
66     </select>
67     市：<select id="selC" style="width: 93px">
68     </select>
69  </span>

 1 <%@ WebHandler Language="C#" Class="WUCCity" %>
 2 
 3 using System;
 4 using System.Web;
 5 
 6 /// <summary>
 7 /// 输出省和市
 8 /// </summary>
 9 public class WUCCity : IHttpHandler {
10     BLL.AreaBLL bll = new BLL.AreaBLL();
11    
12     public void ProcessRequest (HttpContext context) {
13         context.Response.ContentType = "text/plain";
14         System.Text.StringBuilder sbHtml = new System.Text.StringBuilder();
15     string strType=context.Request.QueryString["type"];
16     if (strType=="p")//1.获取省数据，返回json数组格式字符串
17     {
18         
19         //查询数据库，获得 省集合
20             System.Collections.Generic.List<MODEL.Area> list = bll.GetProList();
21             sbHtml.Append("[");
22             foreach (MODEL.Area model in list)
23             {
24                 sbHtml.Append("{AID:" + model.AID + ",AName:'" + model.AName + "'},");
25             }
26             sbHtml.Remove(sbHtml.Length-1,1).Append("]");
27         
28         }
29         else if (strType=="c")//2.根据省ID获得市数据，返回json数组格式 字符串
30         
31         {
32             string proId=context.Request.QueryString["pid"];
33              //获得市数据
34             System.Collections.Generic.List<MODEL.Area> list = bll.GetCityList(proId);
35             sbHtml.Append("[");
36             foreach (MODEL.Area model in list)
37             {
38                 sbHtml.Append("{AID:" + model.AID + ",AName:'" + model.AName + "'},");
39             }
40             sbHtml.Remove(sbHtml.Length - 1, 1).Append("]"); 
41         }
42         
43          //最后输出 json格式数组字符串 到浏览器
44         context.Response.Write(sbHtml.ToString());
45     }
46         
47     
48  
49     public bool IsReusable {
50         get {
51             return false;
52         }
53     }
54 
55 }