静态页面
<head runat="server">
<title></title>
<script src="jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
function changeCity() {
var c = $("#Select1").val();
var bei = $("#Select2");
var tian = $("#Select3");
if (c == "1") {
bei.show();
tian.hide();
}
if (c == "2") {
bei.hide();
tian.show();
}
}
</script>
</head>
<body onload="changeCity();">
<form id="form1" runat="server">
<div>
城市:<select id="Select1" onchange="changeCity();">
<option value="1">北京</option>
<option value="2">天津</option>
</select>
城区:
<select id="Select2">
<option value="1">朝阳区</option>
<option value="2">海淀区</option>
</select>
<select id="Select3" >
<option value="1">和平区</option>
<option value="2">塘沽区</option>
</select>
</div>
</form>
</body>
-----------------------------------------------------------------------------
支持后台数据
<head runat="server">
<title></title>
<script src="jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
function get() {
var dataParamter = "city=" + $("#city").val(); ;
$.ajax({
type: "POST",
dataType: "xml",
url: "Cityaaaa.ashx",
data: dataParamter,
success: function (data) {
var qu = $("#sel_b"); var op = "";
var nodeList = $("node", data);
if (nodeList.length > 0) {
nodeList.each(function (i) {
var nodeID = $(this).children("ID").text();
var typeName = $(this).children("name").text();
op += "<option value='" + nodeID + "'>" + typeName + "</option>";
});
}
qu.html(op);
}
});
}
</script>
</head>
<body onload="get();">
<form id="form1" runat="server">
<div>
城市:<select id="city" onchange="get();">
<option value="1">北京</option>
<option value="2">天津</option>
</select>
城区:
<select id="sel_b">
</select>
<br />
------------------------------------------------------------------------------
<br />
</div>
</form>
</body>
public class Cityaaaa : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
StringBuilder returnStr = new StringBuilder("<nodes>");
if (!string.IsNullOrEmpty(context.Request["city"]))
{
int level;
if (int.TryParse(context.Request["city"], out level))
{
if (string.IsNullOrEmpty(context.Request["city"]) == false)
{
int type;
if (int.TryParse(context.Request["city"], out type))
{
IList<City> codeTypeList = this.GetData(type);
if (codeTypeList != null && codeTypeList.Count > 0)
{
string listStr = GetCodeType(codeTypeList);
if (string.IsNullOrEmpty(listStr) == false)
{
returnStr.Append(listStr);
}
}
}
}
}
}
returnStr.Append("</nodes>");
context.Response.ContentType = "text/xml";
context.Response.Write(returnStr.ToString());
}
//组建代码扩展信息XML节点串
private string GetCodeType(IList<City> typeList)
{
StringBuilder codeSb = new StringBuilder();
if (typeList != null && typeList.Count > 0)
{
foreach (City code in typeList)
{
codeSb.Append("<node>");
codeSb.Append("<ID>" + code.ID + "</ID>");
codeSb.Append("<name>" + code.Name + "</name>");
codeSb.Append("</node>");
}
}
return codeSb.ToString();
}
private IList<City> GetData(int flag)
{
IList<City> list = new List<City>();
switch (flag)
{
case 1:
list.Add(new City() { ID = 1, Name = "东城区" });
list.Add(new City() { ID = 2, Name = "xi城区" });
list.Add(new City() { ID = 3, Name = "bei城区" });
list.Add(new City() { ID = 4, Name = "nan城区" });
break;
case 2:
list.Add(new City() { ID = 1, Name = "111" });
list.Add(new City() { ID = 2, Name = "xi222城区" });
list.Add(new City() { ID = 3, Name = "bei3333城区" });
list.Add(new City() { ID = 4, Name = "nan4444城区" });
break;
default:
break;
}
return list;
}
public bool IsReusable
{
get
{
return false;
}
}
}
。cs文件中的