州市下拉不起作用

我在網上找到了國家州市下拉式代碼。但我只想要州和城市。所以做了一些改變，因爲它不能正常工作，這是編輯後的代碼，請告訴我它有什麼問題嗎？謝謝。州市下拉不起作用

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.1 Transitional//EN"> 
<html> 
<font face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"> 
<head> 

<!--start head--> 


<title>State - City Dropdown</title> 

<script type="text/javascript"> 

// State lists 
var cities = new Array(); 

cities['Gujarat'] = new Array('Ahmedabad','Vadodara','Surat'); 
cities['Rajasthan'] = new Array('Jaisalmer','Chittod','Jaipur'); 
cities['maharashtra'] = new Array('Mumbai','Pune','Nasik'); 


// City lists 


function setcities() { 
    stateSel = document.getElementById('state'); 
    cityList = cities[stateSel.value]; 
    changeSelect('city', cityList, cityList); 

} 



function changeSelect(fieldID, newOptions, newValues) { 
    selectField = document.getElementById(fieldID); 
    selectField.options.length = 0; 
    for (i=0; i<newOptions.length; i++) { 
    selectField.options[selectField.length] = new Option(newOptions[i], newValues[i]); 
    } 
} 

function addLoadEvent(func) { 
    var oldonload = window.onload; 
    if (typeof window.onload != 'function') { 
    window.onload = func; 
    } else { 
    window.onload = function() { 
     if (oldonload) { 
     oldonload(); 
     } 
     func(); 
    } 
    } 
} 

addLoadEvent(function() { 
    setcities(); 
}); 
</script> 



<fieldset style="width: 300px;"> 
<legend><strong>Make your selection</strong></legend> 
<p> 
<!-- <form name="test" method="POST" action="processingpage.php"> --> 
<form> 
<table> 
<tr> 
<td style="text-align: left;">States:</td> 
<td style="text-align: left;"> 
<select name="State" id="State" onChange="setcities();"> 
    <option value="Gujarat">Gujarat</option> 
    <option value="Rajasthan">Rajasthan</option> 
    <option value="Maharashtra">Maharashtra</option> 
</select> 
</td> 
</tr><tr> 
<td style="text-align: left;">City:</td> 
<td style="text-align: left;"> 
<select name="City" id="city" onChange="setcities();"> 
    <option value="">Please select a City </option> 
</select> 
</td> 
</tr> 
</table> 
</form> 
</fieldset> 
</font></body></html>

來源

2014-01-31 user3243970

javaScript的屬性是大小寫敏感的你已經使用狀態國家和馬哈拉施特拉邦的馬哈拉施特拉邦糾正，或使用下面的代碼，

<!--start head--> 


<title>State - City Dropdown</title> 

<script type="text/javascript"> 

// State lists 
var cities = new Array(); 

cities['Gujarat'] = new Array('Ahmedabad','Vadodara','Surat'); 
cities['Rajasthan'] = new Array('Jaisalmer','Chittod','Jaipur'); 
cities['Maharashtra'] = new Array('Mumbai','Pune','Nasik'); 


// City lists 


function setcities() { 
    stateSel = document.getElementById('State'); 
    cityList = cities[stateSel.value]; 
    changeSelect('city', cityList, cityList); 

} 



function changeSelect(fieldID, newOptions, newValues) { 
    selectField = document.getElementById(fieldID); 
    selectField.options.length = 0; 
    for (i=0; i<newOptions.length; i++) { 
    selectField.options[selectField.length] = new Option(newOptions[i], newValues[i]); 
    } 
} 

function addLoadEvent(func) { 
    var oldonload = window.onload; 
    if (typeof window.onload != 'function') { 
    window.onload = func; 
    } else { 
    window.onload = function() { 
     if (oldonload) { 
     oldonload(); 
     } 
     func(); 
    } 
    } 
} 

addLoadEvent(function() { 
    setcities(); 
}); 
</script> 



<fieldset style="width: 300px;"> 
<legend><strong>Make your selection</strong></legend> 
<p> 
<!-- <form name="test" method="POST" action="processingpage.php"> --> 
<form> 
<table> 
<tr> 
<td style="text-align: left;">States:</td> 
<td style="text-align: left;"> 
<select name="State" id="State" onChange="setcities();"> 
    <option value="Gujarat">Gujarat</option> 
    <option value="Rajasthan">Rajasthan</option> 
    <option value="Maharashtra">Maharashtra</option> 
</select> 
</td> 
</tr><tr> 
<td style="text-align: left;">City:</td> 
<td style="text-align: left;"> 
<select name="City" id="city" onChange="setcities();"> 
    <option value="">Please select a City </option> 
</select> 
</td> 
</tr> 
</table> 
</form> 
</fieldset> 
</font></body></html>

來源

2014-01-31 09:16:49 Sam1604

更改ID state到State和更改cities['maharashtra']到cities['Maharashtra']

試試這個代碼：

DEMO

function setcities() { 
var stateSel = document.getElementById("State"); 
    console.log(stateSel); 
    cityList = cities[stateSel.value]; 
    changeSelect('city', cityList, cityList); 

}

來源

2014-01-31 09:10:04 Manoj

你聲明的HTML組件是ID爲「 St吃了'，但你閱讀'狀態'。項目中最佳做法是使用jQuery。 jQuery將處理跨瀏覽器問題，並且在編碼時會很方便。

來源

2014-01-31 09:12:33

州市下拉不起作用

回答

相關問題