下拉列表级联操作

来源:互联网 发布:windows whistler 2257 编辑:程序博客网 时间:2024/05/18 04:00
<html><head><script language="javascript">var proArray=new Array();proArray[0]="山东省";proArray[1]="辽宁省";var cityArray=new Array();cityArray[0]=['青岛','烟台'];cityArray[1]=['沈阳','大连'];var quArray=new Array();quArray[0]=["黄岛","崂山"];quArray[1]=["芝罘","莱山"];quArray[2]=["和平"];quArray[3]=["中山","沙河口"];function findCity(ev){var size=ev.value;city.options.length=0;for(i=0;i<cityArray[size].length;i++){var cityOption = new Option(cityArray[size][i],cityArray[size][i]);city.options.add(cityOption);}findQu(city);}function findQu(ev){var cityName=ev.value;qu.options.length=0;var size=0;if(cityName=="青岛"){size=0;}else if(cityName=="烟台"){size=1;}else if(cityName=="沈阳"){size=2;}else if(cityName=="大连"){size=3;}for(i=0;i<quArray[size].length;i++){var quOption = new Option(quArray[size][i],quArray[size][i]);qu.options.add(quOption);}}</script></head><body><h1>下拉列表级联操作</h1><table><tr><td>省:<select id="pro" onChange="findCity(this)"><script language="javascript">for(i=0;i<proArray.length;i++){var province=proArray[i];var option=new Option(proArray[i],i);pro.options.add(option);}</script></select></td></tr><tr><td>市:<select id="city" onChange="findQu(this)"><script language="javascript">for(i=0;i<cityArray[0].length;i++){var cityname=cityArray[0][i];var option=new Option(cityname,cityname);city.options.add(option);}</script></select></td></tr><tr><td>区:<select id="qu" ><script language="javascript">for(i=0;i<quArray[0].length;i++){var quname=quArray[0][i];var option=new Option(quname,quname);qu.options.add(option);}</script></select></td></tr></table></body></html>


原创粉丝点击