在html中做表格
发布网友
共1个回答
热心网友
<html>
<head>
<style>
#tab0{
display : block ;}
#tab1{
display : none ;}
#tab2{
display : none ;}
#tab3{
display : none ;}
</style>
<title></title>
</head>
<body>
<select onchange="showtab()" id="mysel">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<table id="tab0" border="1">
<tr>
<td>表格0</td>
<td>表格0</td>
</tr>
<tr>
<td>表格0</td>
<td>表格0</td>
</tr>
</table>
<table id="tab1" border="1">
<tr>
<td>表格1</td>
<td>表格1</td>
</tr>
<tr>
<td>表格1</td>
<td>表格1</td>
</tr>
</table>
<table id="tab2" border="1">
<tr>
<td>表格2</td>
<td>表格2</td>
</tr>
<tr>
<td>表格2</td>
<td>表格2</td>
</tr>
</table>
<table id="tab3" border="1">
<tr>
<td>表格3</td>
<td>表格3</td>
</tr>
<tr>
<td>表格3</td>
<td>表格3</td>
</tr>
</table>
</body>
<script language="javascript" type="text/javascript">
var sel = document.getElementById('mysel');
var tab0 = document.getElementById('tab0');
var tab1 = document.getElementById('tab1');
var tab2 = document.getElementById('tab2');
var tab3 = document.getElementById('tab3');
function showtab()
{
tab0.style.display='none';
tab1.style.display='none';
tab2.style.display='none';
tab3.style.display='none';
var str = 'tab'+sel.selectedIndex;
var tab = document.getElementById(str);
tab.style.display='block';
}
</script>
</html>
