Onchange的小筆記
以下這是最簡單的Onchange說明：

<select name=select onchange="functionname(this.options[this.options.selectedIndex].value)">

<? // 意思就是，這個下拉式選單名字是select ， 只要你改變了他(也就是下拉之後)，會執行一個副程式，副程式名字是functionname， 至於會做哪些事情，functionname
後面的()中的內容了 ?>
<option value="">請選擇
<option value="1">Item 1
<option value="2">Item 2
<option value="3">Item 3
</select>

<script>
function functionname(s)
{
    txt.value+=s;
    //選擇後,讓第一項被選中,這樣,就Change啦.
    document.all.sel.options[0].selected=true;
}
</script>
<textarea id=txt></textarea>
 
這裡提供一個事件給大家玩一下，是個很簡單的事件：你選了某一個選項之後，會跳出另一個可以選的選單。
 
<script language="JavaScript">

</script>
<label>
        <select name="type" onchange="show()">
          <option>請選擇類型</option>
          <option value="0">A</option>
          <option value="1">B</option>
        </select>
        <div id="type_A" style="position:absolute; z-index:1; visibility: hidden; ">
        <select name="type_value">
          <option value="1">1</option>
          <option value="2">2</option>
          <option value="3">3</option>       
        </select></div>
        <div id="type_B" style="position:absolute; z-index:1; visibility: hidden; ">
        <select name="type_value">
          <option value="4">4</option>
          <option value="5">5</option>
          <option value="6">6</option>          
        </select></div>
        
        </label>
這裡的重點呢，是要將你要隱藏 / 顯示 的部份，用div包起來，讓它變成一個物件，這樣就會有效果了。
 
延伸閱讀：兩層式選單
arrow
arrow
    全站熱搜

    Joy 發表在 痞客邦 留言(2) 人氣()