2013-07-29 74 views
0

以下是我的代码。我想选择当它出现在div,但是,当我按下提交,字undefined出现,而不是我希望它成为的话。如何获得javascript中的选择值?

当我使用=代替==,例如if(age="toddlers"),句子"Bring to picnic"显示所有选定的选项。

因此,我怀疑这是因为我没有正确读取值。我试过

if (document.getElementsByTagName('option') == "toodlers") 

它完全不工作。我刚开始学习HTML,CSS和JS。我试着Google搜索了几个小时,但仍然无法修复。

<form name="outing"> 
<select id="outing"> 
<option value="toddlers">Toddlers</option> 
<option value="children">Children</option> 
<option value="teenagers">Teenagers</option> 
<option value="adults">Adults</option> 
<option value="eldery">Elderly</option> 
</select> 
<input type="button" name="button" value="Go!" onClick="familyOuting();"> 
<input type="reset" value="Reset" onClick="window.location.reload()"/> 
</form> 

<script type="text/javascript"> 
    function familyOuting(){ 
     var age = document.getElementById("outing").selectedIndex; 
     if(age=="toddlers"){ 
      var place = "Bring to picnic"; 
     } 
     if(age=="children"){ 
      var place = "Bring to playground"; 
     } 
     if(age=="teenagers"){ 
      var place = "Bring to swimming pool"; 
     } 
     if(age=="adults"){ 
      var place = "Bring to dinner"; 
     } 
     if(age=="elderly"){ 
      var place = "Bring to picnic"; 
     } 
     document.getElementById("xxx").innerHTML=(place); 
    } 
</script> 
<div id="xxx"> 

回答

2

selectedIndex会返回一个整数,因此它永远不会匹配您的字符串,

而是使用value ......

var age = document.getElementById("outing").value; 

此外,在您的比较,使用===为严格比较琴弦......

if(age==="toddlers"){ 
    var place = "Bring to picnic"; 
} 
+0

或者选择与_selectedIndex_的_option_并获得这_value_。 –

+0

感谢:d其完美的工作现在 –

+0

没有problemo .... :) – KyleK

0
<select id="mySelect"> 
    <option value="apple">Apple</option> 
    <option value="orange">Orange</option> 
    <option value="pineapple">Pineapple</option> 
    <option value="banana">Banana</option> 
</select> 

var x = document.getElementById("mySelect"); 
x.options[x.selectedIndex].value 
+1

如果在页面上有多个'select'元素这是行不通的。 –

+1

@FelixKling你是对的。编辑它,这个应该工作:) – v2b