複製程式碼 代碼如下: Insert title here <BR>//初始化一個二維數組儲存城市列表項目<BR>var cities=[ <BR>["安慶","合肥","桐城"], <BR>["石家莊","保定","唐山"], <BR>["鄭州","洛陽","開封"] <BR>]; <BR>//選中某個省份時候，調用添加城市的方法<BR>function provinceChanged(sel){ <BR>// alert("select的長度" sel.options.length); <BR>//sel其實就是select物件<BR>//遍歷options集合，找出選取的選項<BR>for(var x=0;x<sel .options.length;x ) <BR>{ <BR>var opt=sel.options[x]; <BR>if(opt.selected) <BR>{ <BR>//給被選中的城市的select 添加option <BR>addCityToSelect(x) <BR>} <BR>} <BR>} <BR>//加入選取省份下的城市項到city的select中<BR>function addCityToSelect(x){ <BR>/ /從二維陣列找出對應的城市<BR>var city=cities[x-1]; <BR>var citySelect=document.getElementById("select_city"); <BR>/*====== ============刪除節點中已經存在的元素=============== <BR>在第二次或第n次呼叫方法的時候城市select物件中已經新增了先前新增的節點，所以有清空。 <BR>思路1：select物件的removeChild(),所以透過迴圈遍歷可以刪除字節點。 <BR>思路2：直接設定select.options.length=1可以達到相同效果。 <BR>*/ <BR>//設定城市的select物件下的options長度為1 <BR>citySelect.options.length=1; <BR>//設定options集合的長度，刪除<BR>//citySelect .options.length=1; <BR>for(var x=0;x<city.length;x ) <BR>{ <BR>//建立元素節點物件<BR>var optionName=document.createElement("option "); <BR>//給option設定顯示內容<BR>optionName.innerHTML=city[x]; <BR>//將建立的option加入select <BR>citySelect.appendChild(optionName); <BR> /* <BR>在這個地方將某一個省份下面的所有城市加到citySelect物件下面以後<BR>當第二次選擇第二個省份的時候，第二個省份的下面的所有城市有會被追加到<BR>citySelect節點下方。這樣的效果就錯了。所以要求在每次加入之前，要 <BR>對citySelect節點下面的內容進行清空。接著看：<BR>==================刪除節點中已經存在的元素 =============== <BR>* / <BR>} <BR>} <BR> 把物件本身當作參數傳遞，以便對其進行操作。 --> 請選省 安徽 河北 河南 請選擇城市
