table tr 显示的有关问题(疑是IE的BUG)

2012-04-04

table tr 显示的问题(疑是IE的BUG)在系统中有一表格，有隐藏 TR的操作，但发现行显示异常。后浓缩为以下程序，

table tr 显示的问题(疑是IE的BUG)
在系统中有一表格，有隐藏 TR的操作，但发现行显示异常。后浓缩为以下程序，发现的确与TR的隐藏有关。
具体表现在，当先点击第一行，隐藏了某些行后，再点击最后一行，本应相应的行颜色变化，但现在却是在行的顶部留有一细长条，其颜色没有变化。（我用的IE8.0版本),疑为IE8.0的BUG.不知哪位高手有何建议能够解决这个问题。谢谢了。

<html xmlns="http://www.w3.org/1999/xhtml" >
<head >
<title>TABLE TR</title>
</head>
<body>

<table id="tab" border=1 width=200>
<tr id="trMain1" onclick="hidden()"><td>a [click me first.]</td></tr>
<tr id="trSub1"><td>b</td></tr>
<tr id="trSub2"><td>c</td></tr>
<tr id="trMain2"><td>d</td></tr>
<tr id="trMain3" onclick="this.style.backgroundColor='#7DD6F0'"><td>e</td></tr>
<tr id="trMain4" onclick="this.style.backgroundColor='#7DD6F0'"><td>f</td></tr>
<tr id="trSub3" onclick="this.style.backgroundColor='#7DD6F0'"><td>g</td></tr>
<tr id="trSub4" onclick="this.style.backgroundColor='#7DD6F0'"><td>h [click me second.]</td></tr>
</table>

</body>
</html>
<script>
var hs=false;
function hidden()
{
var c = (hs)?("block"):("none");
document.getElementById("trMain2").style.display = c;
document.getElementById("trMain3").style.display = c;
document.getElementById("trMain4").style.display = c;
hs = !hs;
}
</script>

[解决办法]
没有问题啊
[解决办法]

HTML code

<html xmlns="http://www.w3.org/1999/xhtml" ><head>  <title>TABLE TR</title><script>var hs = false;//hidden是保留字，在Chrome等浏览器中会报错function tr_hidden() {  (hs) ? (c = "table-row") : (c = "none"); //正常的表格行display属性值应为table-row  document.getElementById("trMain2").style.display = c;  document.getElementById("trMain3").style.display = c;  document.getElementById("trMain4").style.display = c;  hs = !hs;}</script></head><body><table id="tab" border=1 width=200><tr id="trMain1" onclick="tr_hidden()"><td>a [click me first.]</td></tr><tr id="trSub1"><td>b</td></tr><tr id="trSub2"><td>c</td></tr><tr id="trMain2"><td>d</td></tr><tr id="trMain3" onclick="this.style.backgroundColor='#7DD6F0'"><td>e</td></tr><tr id="trMain4" onclick="this.style.backgroundColor='#7DD6F0'"><td>f</td></tr><tr id="trSub3" onclick="this.style.backgroundColor='#7DD6F0'"><td>g</td></tr><tr id="trSub4" onclick="this.style.backgroundColor='#7DD6F0'"><td>h [click me second.]</td></tr></table></body></html>
[解决办法]
着色的问题，貌似是由IE对表格边框合并有不同解释造成的，加上border-collapse:collapse样式可以解决。IE就是个麻烦啊。
HTML code<table id="tab" border="1" width="200" style="border-collapse:collapse;">

热点排行

CSS

table tr 显示的有关问题(疑是IE的BUG)