87,910
社区成员
发帖
与我相关
我的任务
分享td样式的display属性在Mozilla下失常了
<html>
<head>
<title>test</title>
<script language="javascript">
function selectTable(x)
{
var MyTab = document.getElementById('MyTable');
var MyTBD = MyTab.tBodies;
for (var i=0; i<MyTBD.length; i++)
{
MyTBD[i].style.display = 'none';
}
MyTBD[x].style.display = 'block';
}
</script>
</head>
<body>
<input type='button' onclick='selectTable(0)' value='0' />
<input type='button' onclick='selectTable(1)' value='1' />
<input type='button' onclick='selectTable(2)' value='2' />
<table id='MyTable' width="500">
<tbody style='display:block;border:1px solid #000000'>
<tr>
<td height="50"><input type="checkbox" name="SeqId" value="10"> 10</td>
</tr>
</tbody>
<tbody style='display:none;border:1px solid #000000'>
<tr>
<td height="50"><input type="checkbox" name="SeqId" value="11"> 11</td>
</tr>
</tbody>
<tbody style='display:none;border:1px solid #000000'>
<tr>
<td height="50"><input type="checkbox" name="SeqId" value="12"> 12</td>
</tr>
</tbody>
</table>
</body>
</html>
这是一个模拟选项卡的程序，在ie下是没有问题的，而凡是基于Gecko的浏览器，都会产生异常，那个td的style.display不停的更改时，td会不停的往下移动，用document.body.innerHTML跟踪，发现代码没有变化的，请问怎么解决
<head>
<title>test</title>
<script language="javascript">
function selectTable(x)
{
var MyTab = document.getElementById('MyTable');
var MyTBD = MyTab.tBodies;
for (var i=0; i<MyTBD.length; i++)
{
MyTBD[i].style.display = 'none';
}
MyTBD[x].style.display = 'block';
}
</script>
</head>
<body>
<input type='button' onclick='selectTable(0)' value='0' />
<input type='button' onclick='selectTable(1)' value='1' />
<input type='button' onclick='selectTable(2)' value='2' />
<table id='MyTable' width="500">
<tbody style='display:block;border:1px solid #000000'>
<tr>
<td height="50"><input type="checkbox" name="SeqId" value="10"> 10</td>
</tr>
</tbody>
<tbody style='display:none;border:1px solid #000000'>
<tr>
<td height="50"><input type="checkbox" name="SeqId" value="11"> 11</td>
</tr>
</tbody>
<tbody style='display:none;border:1px solid #000000'>
<tr>
<td height="50"><input type="checkbox" name="SeqId" value="12"> 12</td>
</tr>
</tbody>
</table>
</body>
</html>
这是一个模拟选项卡的程序，在ie下是没有问题的，而凡是基于Gecko的浏览器，都会产生异常，那个td的style.display不停的更改时，td会不停的往下移动，用document.body.innerHTML跟踪，发现代码没有变化的，请问怎么解决
...全文
请发表友善的回复…
发表回复
menrock 2005-09-21
- 打赏
- 举报
<html>
<head>
<title>test</title>
<script language="javascript">
function selectTable(x)
{
var MyTab = document.getElementById('MyTable');
var MyTBD = MyTab.tBodies;
for (var i=0; i<MyTBD.length; i++)
{
MyTBD[i].style.display = 'none';
}
MyTBD[x].style.display = '';
}
</script>
</head>
<body>
<input type='button' onclick='selectTable(0)' value='0' />
<input type='button' onclick='selectTable(1)' value='1' />
<input type='button' onclick='selectTable(2)' value='2' />
<table id='MyTable' width="500">
<tbody style='display:;border:1px solid #000000'>
<tr>
<td height="50"><input type="checkbox" name="SeqId" value="10"> 10</td>
</tr>
</tbody>
<tbody style='display:none;border:1px solid #000000'>
<tr>
<td height="50"><input type="checkbox" name="SeqId" value="11"> 11</td>
</tr>
</tbody>
<tbody style='display:none;border:1px solid #000000'>
<tr>
<td height="50"><input type="checkbox" name="SeqId" value="12"> 12</td>
</tr>
</tbody>
</table>
</body>
</html>
<head>
<title>test</title>
<script language="javascript">
function selectTable(x)
{
var MyTab = document.getElementById('MyTable');
var MyTBD = MyTab.tBodies;
for (var i=0; i<MyTBD.length; i++)
{
MyTBD[i].style.display = 'none';
}
MyTBD[x].style.display = '';
}
</script>
</head>
<body>
<input type='button' onclick='selectTable(0)' value='0' />
<input type='button' onclick='selectTable(1)' value='1' />
<input type='button' onclick='selectTable(2)' value='2' />
<table id='MyTable' width="500">
<tbody style='display:;border:1px solid #000000'>
<tr>
<td height="50"><input type="checkbox" name="SeqId" value="10"> 10</td>
</tr>
</tbody>
<tbody style='display:none;border:1px solid #000000'>
<tr>
<td height="50"><input type="checkbox" name="SeqId" value="11"> 11</td>
</tr>
</tbody>
<tbody style='display:none;border:1px solid #000000'>
<tr>
<td height="50"><input type="checkbox" name="SeqId" value="12"> 12</td>
</tr>
</tbody>
</table>
</body>
</html>
