這個for循環在javascript中有什麼問題？

Question

我想在HTML簡單的選擇項目用JavaScript和我有以下代碼：

<script type="text/javascript"> 
var capitals = { 
California : "Los Angeles", 
Georgia : "Atlanta", 
Florida : "Miami" 
} 
window.onload = function() { 
var mySelect = document.getElementById("states") 
for (state in capitals) { 
    var myOption = document.createElement("option") 
    myOption.text = state; 
    myOption.value = state; 
    mySelect.appendChild(myOption) 
} 
mySelect.onchange = function(){ 
if (this.value != ""){ 
alert("The capital of" + this.value + " is " capital[this.value]); 

} 

} 
} 

</script> 

，這是HTML代碼：

<select id="states"> 
     <option value=""> Select state </option> 
    </select> 

，但它不工作:(

Answer 1

您在onchange塊中有語法錯誤

var capitals = { 
 
California : "Los Angeles", 
 
Georgia : "Atlanta", 
 
Florida : "Miami" 
 
} 
 

 
var mySelect = document.getElementById("states") 
 
for (state in capitals) { 
 
    var myOption = document.createElement("option") 
 
    myOption.text = state; 
 
    myOption.value = state; 
 
    mySelect.appendChild(myOption) 
 
} 
 
mySelect.onchange = function(){ 
 
if (this.value != ""){ 
 
alert("The capital of" + this.value + " is " + capital[this.value]); 
 

 
} 
 

 
}

<select id="states"> 
 
     <option value=""> Select state </option> 
 
    </select>

Answer 2

The JavaScript Console是一個可以爲您節省大量時間的工具。在Windows擊打在Chrome，Firefox或IE F12將打開一個面板，您可以訪問諸如錯誤日誌，網絡請求等數據

如果您導航到Console標籤，你會看到你缺少一個+登錄您的提醒，並在同一行上忘記capital之後的s。

alert("The capital of " + this.value + " is " capital[this.value]);

應該

alert("The capital of" + this.value + " is " + capitals[this.value]);

試試吧

var capitals = { 
 
    California: "Los Angeles", 
 
    Georgia: "Atlanta", 
 
    Florida: "Miami" 
 
}; 
 
window.onload = function() { 
 
    var mySelect = document.getElementById("states"); 
 
    for (state in capitals) { 
 
    var myOption = document.createElement("option"); 
 
    myOption.text = state; 
 
    myOption.value = state; 
 
    mySelect.appendChild(myOption); 
 
    } 
 
    mySelect.onchange = function() { 
 
    if (this.value != "") { 
 
     alert("The capital of " + this.value + " is " + capitals[this.value]); 
 
    } 
 
    }; 
 
}

<select id="states"> 
 
    <option value=""> Select state </option> 
 
</select>

Answer 3

你有很多小錯誤：

var capitals = { //keys need to be in quotes 
 
    "California" : "Los Angeles", 
 
    "Georgia" : "Atlanta", 
 
    "Florida" : "Miami" 
 
}; 
 

 
window.onload = function() { 
 
    var mySelect = document.getElementById("states"); 
 
    
 
    for (var state in capitals) { //add var 
 
     var myOption = document.createElement("option"); 
 
     myOption.text = state; 
 
     myOption.value = state; 
 
     mySelect.appendChild(myOption); 
 
    } 
 
    mySelect.onchange = function(){ 
 
     if (this.value != ""){ 
 
      alert("The capital of" + this.value + " is " + capitals[this.value]); //add "+" and make it "capitals" 
 
     } 
 
    } 
 
}

<select id="states"> 
 
    <option value=""> Select state </option> 
 
</select>