[JavaScript]利用JavaScript控制table中row的顯示

   在程式中有時候我們需要根據選擇來顯示我們需要的資訊,通過控制table中row的顯示可以實現這樣的功能.
 

NoneRow1Row2Row3

Row1

Row2

Row3

JavaScript <script  language=javascript >
function changeRow(id, status) {
document.getElementById("Row1").style.display ="none";
document.getElementById("Row2").style.display ="none";
document.getElementById("Row3").style.display ="none";
    var elm = document.getElementById("Row"+id);
    if (!elm)
        return false;
    
    elm.style.display = (status == true) ? "" : "none";
}
</script>

HTML<table width="100%" border="0">
  <tr>
    <td>
         <select name="select"  onchange="javascript: changeRow(this.value,true);">
          <option value="0">None</option>
          <option value="1">Row1</option>
          <option value="2">Row2</option>
          <option value="3">Row3</option>
        </select>
         </td>
  </tr>
  <tr id=Row1 style="display: none;">
    <td bgcolor="#99FF00">Row1</td>
  </tr>
  <tr id=Row2 style="display: none;">
    <td bgcolor="#CCCC99">Row2</td>
  </tr>
  <tr id=Row3 style="display: none;">
    <td bgcolor="#FFCC99">Row3</td>
  </tr>
</table>