利用JavaScript控制table中row的显示

From : http://www.cnblogs.com/mhx1982/archive/2006/06/01/414505.html
<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>
<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>

其中
elm.style.display = (status == true? "" : "none";
比较重要,控制显示
posted @ 2007-05-24 09:50  jhtchina  阅读(1182)  评论(0)    收藏  举报