下拉菜單選擇國家然後州和地區

我不能設計「print_district」函數來從s_b獲取值。請幫助我定義這個多維數組。下拉菜單選擇國家然後州和地區

我想從c國，c21，c22，c23，從C1國家選擇C1從012國家選擇C1的c11，c12，c13，... 但是我得到了d11，d12， d13，...和d12，d22,23等來自國家2

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Untitled Document</title> 
<script type= "text/javascript"> 
var country_arr = new Array("country 1", "country 2"); 
var s_a = new Array(); 
s_a[0]=""; 
s_a[1]="C1|C2"; 
s_a[2]="D1|D2"; 

var s_b = new Array(); 
s_b[1,1]="c11|c12|c13|c14|c15|c16|c17|c18|c19|c10"; 
s_b[1,2]="c21|c22|c23|c24|c25|c26|c27|c28|c29|c210"; 
s_b[2,1]="d11|d12|d13|d14|d15|d16|d17|d18|d19|d10"; 
s_b[2,2]="d21|d22|d23|d24|d25|d26|d27|d28|d29|d210"; 
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); 
    option_str.length=0; 
    option_str.options[0] = new Option('Select Country',''); 
    option_str.selectedIndex = 0; 
    for (var i=0; i<country_arr.length; i++) { 
     option_str.options[option_str.length] = new Option(country_arr[i],country_arr[i]); 
    } 
} 

function print_state(state_id, state_index){ 
    var option_str = document.getElementById(state_id); 
    option_str.length=0; 
    option_str.options[0] = new Option('Select State',''); 
    option_str.selectedIndex = 0; 
    var state_arr = s_a[state_index].split("|"); 
    for (var i=0; i<state_arr.length; i++) { 
     option_str.options[option_str.length] = new Option(state_arr[i],state_arr[i]); 
    } 
} 
//This function is incorrect, just to demonstrate, please help to correct this 

function print_district(district_id, district_index){ 
    var option_str = document.getElementById(district_id); 
    option_str.length=0; 
    option_str.options[0] = new Option('Select district',''); 
    option_str.selectedIndex = 0; 
    var district_arr = s_b[district_index].split("|"); 
    for (var i=0; i<district_arr.length; i++) { 
     option_str.options[option_str.length] = new Option(district_arr[i],district_arr[i]); 
    } 
} 

</script> 
</head> 

<body> 
<form> 
Select Country: <select onchange="print_state('state',this.selectedIndex);" id="country" name ="country" ></select> 
     <br /> 
     State: <select onchange="print_district('district',this.selectedIndex);" name ="state" id ="state"></select> 
     <br /> 
     District <select name ="district" id ="district"></select> 
     <input type="submit"></form> 
     <script language="javascript">print_country("country");</script> 
</body> 
</html>

在此先感謝！

來源

2014-11-09 Deep 3015

這是解決上述問題

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Untitled Document</title> 
<script> 
var stateObject = { 
    "Country 1": { 
     "C1": ["c11", "c12"], 
     "C2": ["c21", "c22"] 
    }, 
    "Country 2": { 
     "D1": ["d11", "d12"], 
     "D2": ["d21", "d22"] 
    } 
} 
window.onload = function() { 
    var countySel = document.getElementById("countySel"), 
     stateSel = document.getElementById("stateSel"), 
     districtSel = document.getElementById("districtSel"); 
    for (var country in stateObject) { 
     countySel.options[countySel.options.length] = new Option(country, country); 
    } 
    countySel.onchange = function() { 
     stateSel.length = 1; // remove all options bar first 
     districtSel.length = 1; // remove all options bar first 
     if (this.selectedIndex < 1) return; // done 
     for (var state in stateObject[this.value]) { 
      stateSel.options[stateSel.options.length] = new Option(state, state); 
     } 
    } 
    countySel.onchange(); // reset in case page is reloaded 
    stateSel.onchange = function() { 
     districtSel.length = 1; // remove all options bar first 
     if (this.selectedIndex < 1) return; // done 
     var district = stateObject[countySel.value][this.value]; 
     for (var i = 0; i < district.length; i++) { 
      districtSel.options[districtSel.options.length] = new Option(district[i], district[i]); 
     } 
    } 
} 
</script> 
</head> 

<body> 
<form name="myform" id="myForm"> 
    Select Country: <select name="state" id="countySel" size="1"> 
     <option value="" selected="selected">Select Country</option> 
    </select> 
    <br> 
    <br> 
    Select State: <select name="countrya" id="stateSel" size="1"> 
     <option value="" selected="selected">Please select Country first</option> 
    </select> 
    <br> 
    <br> 
    Select District: <select name="district" id="districtSel" size="1"> 
     <option value="" selected="selected">Please select State first</option> 
    </select><br> 
    <input type="submit"> 

</form> 
</body> 
</html>

來源

2014-11-10 18:47:51

你可以使用http://geodata.solutions，這是一個Web服務，它允許您將一些HTML粘貼到你的代碼，這一切只是工作，與上調到目前爲止，完整的數據集和額外選項的負載。這比編寫所有代碼和自己維護數據要容易得多。

來源

2017-02-05 18:00:13

下拉菜單選擇國家然後州和地區

回答

相關問題