錯誤的JavaScript函數，以獲取值的靜態PHP下拉

Question

我做了與PHP的下拉菜單，工作正常。當所選項目改變時，我調用函數changePeriod（）。

$options[0] = '--period--'; 
$options[1] = 'Daily'; 
$options[2] = 'Weekly'; 
$options[3] = 'Monthly'; 

<td><?php echo form_dropdown('period', $options, '0', 'id="period" onchange="changePeriod()"'); ?></td> 

在這裏您可以看到上面代碼導致的HTML源代碼。

<td> 
    <select name="period" id="period" onchange="changePeriod()"> 
     <option value="0" selected="selected">--period--</option> 
     <option value="1">Daily</option> 
     <option value="2">Weekly</option> 
     <option value="3">Monthly</option> 
    </select> 
</td> 

在這個函數中我需要得到所選擇的項的值，但2警報的開關兩者以上得到未定義作爲結果。有沒有人有一個想法，爲什麼我得到未定義，而不是選定的選項的值？它與從數據庫中填充foreach的動態下拉菜單一起工作。

function changePeriod() { 
    alert(document.getElementById("period").selectedIndex); 
    alert(document.getElementById("period").value); 

    switch (document.getElementById("period").selectedIndex) { 
     case 1: 
      alert("daily"); 
      break; 
     case 2: 
      alert("weekly"); 
      break; 
     case 3: 
      alert("monthly"); 
      break; 
    } 
} 

基本上是：爲什麼我不能獲得所選擇的選項的值，我怎麼能解決這個問題？

感謝您的幫助。

Answer 1

是這樣生成的HTML：

<select onchange="changePeriod()" id="period"> 
     <option value="0">--period--</option> 
     <option value="1">Daily</option> 
     <option value="2">Weekly</option> 
     <option value="3">Monthly</option> 
    </select> 
    <script type="text/javascript"> 
     function changePeriod(event) { 
      alert(document.getElementById("period").selectedIndex); 
      alert(document.getElementById("period").value); 

      switch (document.getElementById("period").selectedIndex) { 
       case 1: 
        alert("daily"); 
        break; 
       case 2: 
        alert("weekly"); 
        break; 
       case 3: 
        alert("monthly"); 
        break; 
      } 
     } 
    </script> 

如果是，它爲我工作。

爲什麼你不使用jQuery，你可以用更少的代碼做所有事情。

編輯：

使用jQuery的解決方案：你爲什麼不使用jQuery http://jsfiddle.net/rfWjd/