Maison > Article > interface Web > table tr 显示的问题(疑是IE的BUG)_html/css_WEB-ITnose
table tr 显示的问题(疑是IE的BUG)_html/css_WEB-ITnose
- WBOYoriginal
- 2016-06-24 12:09:091019parcourir
在系统中有一表格，有隐藏 TR的操作，但发现行显示异常。后浓缩为以下程序，发现的确与TR的隐藏有关。
具体表现在，当先点击第一行，隐藏了某些行后，再点击最后一行，本应相应的行颜色变化，但现在却是在行的顶部留有一细长条，其颜色没有变化。（我用的IE8.0版本),疑为IE8.0的BUG.不知哪位高手有何建议能够解决这个问题。谢谢了。
| a [click me first.] |
| b |
| c |
| d |
| e |
| f |
| g |
| h [click me second.] |
<script> <br /> var hs=false; <br /> function hidden() <br /> { <br /> var c = (hs)?("block"):("none"); <br /> document.getElementById("trMain2").style.display = c; <br /> document.getElementById("trMain3").style.display = c; <br /> document.getElementById("trMain4").style.display = c; <br /> hs = !hs; <br /> } <br /> </script>
回复讨论(解决方案)
没有问题啊
<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> 还是不行，各位!
先点第一行，再点最后一行，最后一行的颜色不全！我是IE8.0!!
着色的问题，貌似是由IE对表格边框合并有不同解释造成的，加上 border-collapse:collapse样式可以解决。IE就是个麻烦啊。
<table id="tab" border="1" width="200" style="border-collapse:collapse;">
着色的问题，貌似是由IE对表格边框合并有不同解释造成的，加上border-collapse:collapse样式可以解决。IE就是个麻烦啊。
HTML code
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：DOCTYPE的问题_html/css_WEB-ITnoseArticle suivant：CSS盒模型中“内容区域”的问题~高分求教！_html/css_WEB-ITnose