2016-02-01 115 views
0

我想創建一個基於電視節目的隨機引號生成器。用戶選擇一個節目並點擊提交按鈕之後,該節目應根據所選電視劇播放隨機引用。所有的引號都位於它們的數組中。訪問一個SELECT元素和一個數組元素

我的代碼如下。請你幫我理解爲什麼它不能正常工作以及如何解決它?

<!DOCTYPE html> 
<html> 
<body> 

<h3>A demonstration of how to access a SELECT element</h3> 

<select id="mySelect" size="2"> 
    <option value="1">Suits</option> 
    <option value="2">Supernatural</option> 
</select> 

<p>Click the button to select the show and display a random quote.</p> 

<button onclick="myFunction();">Submit</button> 

<p id="demo"></p> 

<script> 
function myFunction() { 
    var suits = new Array("Specter is fat", "Ross is fat", "Pearsonis fat", "Litt is fat", "Zane is fat"); 
    var supernatural = new Array("Dean is fat", "Sam is fat", "Castiel is fat"); 
    var x = document.getElementById("mySelect").value; 
    switch (x) { 
     case 1: 
     var quote = suits[Math.floor(Math.random()*suits.length)]; 
     document.getElementById("demo").innerHTML = quote; 
     break; 
     case 2: 
     var quote = supernatural[Math.floor(Math.random()*supernatural.length)]; 
     document.getElementById("demo").innerHTML = quote; 
     break; 
    }; 
} 
</script> 

</body> 
</html> 
+2

你能更具體地說明它是如何「不工作」 - 只是不顯示,特定的錯誤等?這可以幫助縮小問題的範圍。 – Erica

回答

1

x值以字符串形式出現,但您的JavaScript switch正在查找整數。它應該按預期工作,如果你使用字符串代替:

switch (x) { 
    case "1": 
     // stuff 
    case "2": 
     // stuff 
} 
0

您可以在此post中看到一個很好的方法來獲取所選選項的值。您的變量quote未被設置。你可以在這個fiddle看到你的變量x被設置,quote從不設置,所以它永遠不會被顯示。

對不起,我在休息時間沒有太多時間來回答這個問題。我無法告訴你爲什麼案例中的代碼不起作用。但也許這個答案會給你開始的地方。