如何為州和城市創建相關的下拉列表

Question

我正在嘗試為城市和（相關）州創建一個相關的下拉列表。 這是state.html

<html>
<head><script type= "text/javascript" src = "countries2.js"></script></head>
<body>
Select Country:   <select onchange="print_state('state',this.selectedIndex);" id="country" name ="country"></select>
            <br />
            City/District/State: <select name ="state" id ="state"></select>
            <script language="javascript">print_country("country");</script>

</body>
</html>

和states.js

var country_arr = new Array("Andaman & Nicobar ","Andhra pradesh","Arunachal Pradesh","maharashtra");

var s_a = new Array();
s_a[0]="";
s_a[1]="Nicobar|North and Middle Andaman|South Andaman";
s_a[2]=" Adilabad|Anantapur|Chittoor|East Godavari|Guntur|Hyderabad|Kadapa|Karimnagar|Khammam|Krishna|Kurnool|Mahabubnagar|Medak|Nalgonda|Nellore|Nizamabad|Prakasam|Rangareddy|Srikakulam|Visakhapatnam|Vizianagaram|Warangal|West Godavari";
s_a[3]="Anjaw|Changlang|Dibang Valley|East Kameng|East Siang|Kurung Kumey|Lohit|Lower Dibang Valley|Lower Subansiri|Papum Pare|Tawang|Tirap|Upper Siang|Upper Subansiri|West Kameng|West Siang";



function print_country(country_id){
    // given the id of the <select> tag as function argument, it inserts <option> tags
    var option_str = document.getElementById(country_id);
    var x, i=0;
    for(x in country_arr){
        option_str.options[i++] = new Option(country_arr[x],country_arr[x]);
    }
}

function print_state(state_id, state_index){
    var option_str = document.getElementById(state_id);
    var x, i=0; state_index++;
    var state_arr = s_a[state_index].split("|");
    for(x in state_arr){
            option_str.options[i++] = new Option(state_arr[x],state_arr[x]);
    }
}

當我嘗試選擇選項時，第二個下拉框中將顯示先前選擇州的城市。 如何避免這種情況？

Answer 1

因為您尚未從“ state_id”元素中刪除先前添加的城市。 因此，在獲取state元素的ID之后，在您的print_state函數中，刪除其所有子元素，然后繼續進行操作。 您可以應用多種方法從DOM節點中刪除子元素。 一種純JavaScript方式如下：

while(option_str.hasChildNodes()){
    option_str.removeChild(option_str.lastChild);
}

如果可以在您的情況下使用此方法，則再次使用一個簡單的線性方法是innerHTML屬性：

option_str.innerHTML = "";     //will remove everything including the childs from the DOM node

如何為州和城市創建相關的下拉列表

問題描述

1 個解決方案

解決方案1
1 已采納 2013-11-03 08:02:01

如何為州和城市創建相關的下拉列表

問題描述

1 個解決方案

解決方案1 1 已采納 2013-11-03 08:02:01

解決方案1
1 已采納 2013-11-03 08:02:01