基於選擇選項顯示和隱藏div的Javascript

Question

我需要一些JavaScript代碼來驗證頁面。下面是HTML，

<select id="sel"> 
<option value="0" selected="selected">Please select</option> 
<option value="first">Link 1</option> 
<option value="second">Link 2</option> 
<option value="third">Link 3</option> 
<option value="last">No Link</option> 
</select> 

<div class="sample" style="display:none;">Sample Text</div> 
<input type="button" value="submit" class="inputclass" /> 

需要一些JavaScript代碼，

1. 當用戶點擊第一個或最後一個選項，顯示div和隱藏的按鈕，當用戶點擊任何鏈接的
2. ，隱藏div和顯示按鈕

PS：

選項中選擇將GE從數據庫動態調整。 我的頁面只能在JavaScript中運行，因此不需要Jquery。

請幫助...

Answer 1

，我認爲這是代碼，你需要的東西：

JS部分：

function getSelection(e) { 
    var selection = document.getElementsByTagName("option"); 
    var index=document.getElementById("sel").selectedIndex; 
    var text = document.getElementById("sample"); 
    var button = document.getElementById("input"); 
    var option=document.getElementById("sel").options; 

    if (option[index].value == "first" || option[index].value == "last") { 
     text.style.display = "block"; 
     button.style.display = "none"; 
    } else { 
     if (text.style.display != "none") { 
      text.style.display = "block"; 
      button.style.display = "none"; 
     } 
     else { 
      text.style.display = "none"; 
      button.style.display = "block"; 
     }   
    } 

    return false;  

} 



document.getElementById("input").onclick = function() { getSelection() }; 

而且HTML（我稍微修改了原來一個更有效地訪問html元素）：

<select id="sel"> 
<option value="0" selected="selected">Please select</option> 
<option value="first">Link 1</option> 
<option value="second">Link 2</option> 
<option value="third">Link 3</option> 
<option value="last">No Link</option> 
</select> 

<div id="sample" style="display:none;">Sample Text</div> 
<input type="button" value="submit" id="input"/>​ 

...和小提琴： http://jsfiddle.net/eaRwa/2/