您的位置:首页 > Web前端 > JavaScript

js 省市下拉列表联动

2012-06-25 18:59 267 查看
Love in coding...

Free and Susan

js 省市下拉列表联动

1.定义 城市 数据数组

2.得到 当前 所选择 的 省

3.得到 当前省 在 城市数组中的位置

4.得到 当前省 所辖制的 地市

5.填充 城市 下拉选单

----------

示例代码如下


<html>


<head>


<title></title>


<script language="javascript" type="text/javascript">


//定义 城市 数据数组


cityArray = new Array();


cityArray[0] = new Array("河南省","郑州市|开封市|洛阳市|平顶山市|安阳市|鹤壁市|新乡市|焦作市|濮阳市|许昌市|漯河市|三门峡市|南阳市|商丘市|信阳市|周口市|驻马店市|济源市");


cityArray[1] = new Array("云南省","昆明市|大理市|曲靖市|玉溪市|昭通市|楚雄市|红河市|文山市|思茅市|西双版纳市|保山市|德宏市|丽江市|怒江市|迪庆市|临沧市");


cityArray[2] = new Array("其它","其它");




function getCity(currProvince)


{


//当前 所选择 的 省


var currProvince = currProvince;


var i,j,k;


//清空 城市 下拉选单


document.all.selCity.length = 0 ;


for (i = 0 ;i <cityArray.length;i++)


{


//得到 当前省 在 城市数组中的位置


if(cityArray[i][0]==currProvince)


{


//得到 当前省 所辖制的 地市


tmpcityArray = cityArray[i][1].split("|")


for(j=0;j<tmpcityArray.length;j++)


{


//填充 城市 下拉选单


document.all.selCity.options[document.all.selCity.length] = new Option(tmpcityArray[j],tmpcityArray[j]);


}


}


}


}


</script>


</head>


<body>


<form id="form1">


<select id="selProvince" onChange = "getCity(this.options[this.selectedIndex].value)">


<option value="">-请选择-</option>


<option value="河南省">河南省</option>


<option value="云南省">云南省</option>


<option value="其它">其它</option>


</select>




<select id="selCity">


<option>-城市-</option>


</select>


</form>


</body>


</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: