下拉框级联

下拉框级联
<form id="form1"runat="server">
<div>
省份：<select id="ddlProvince"onchange="ShowCity()">
<option value="1">江苏</option>
<option value="2">广东</option>
</select>
城市：<select id="ddlCity"></select>
</div>
</form>
var CityList = new Array();
CityList[0] = new Array(); //province id
CityList[1] = new Array(); // city id
CityList[2] = new Array(); // city name
CityList[0][0] = "1";
CityList[1][0] = "1";
CityList[2][0] = "南京";
CityList[0][1] = "1";
CityList[1][1] = "2";
CityList[1][1] = "苏州";
CityList[0][2] = "2";
CityList[1][2] = "3";
CityList[2][2] = "广州";
CityList[0][3] = "2";
CityList[1][3] = "4";
CityList[2][3] = "深圳";
function ShowCity()
{
var ddlProvince = window.document.getElementById("ddlProvince");
var ddlCity = window.document.getElementById("ddlCity");
//获取省份编号
var pValue = ddlProvvince.options[ ddlProvvince.selectedIndex ].value;
ddlCity.options.length = 0;
for(var i=0;i<CityList[0].length;i++)
{
if(CityList[0][i] == pValue)
{
//创建option元素
var op = window.document.createElement("option");
op.value = CityList[1][i];
// 设置文本值
op.innerText = CityList[2][i];
ddlCity.appendChild(op);
}
}
}。