显示隐藏< tr>无法在Chrome和Firefox中使用 [英] Show hide <tr> not working in chrome and firefox

问题描述

有人可以帮助我吗?

我尝试隐藏并显示包含两个单元格的行.内容在第二个单元格中. 它在IE中工作正常，但在FF和Chrome中，似乎所有内容都试图放入第一个单元格的空间中.这是我的代码:

I try to hide and show a row with two cells. The content is in cell two. It is working fine in IE, but in FF and Chrome it seems like all the content trys to fit in the Space of the first cell. Here is my code:

<table border="0" cellpadding="0" cellspacing="0" width="700">
  <tr>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td width="50"></td>
    <td width="650">
      <input type="radio" id="r1" name="r1" value="" class="small" onClick="Hide('div_test', this);">
      <label for="r1">Skjul</label>&nbsp;&nbsp;
      <input type="radio" id="r2" name="r1" value="" class="small" onClick="Reveal('div_test', this);">
      <label for="r2">Vis</label>&nbsp;&nbsp;
    </td>
  </tr>
  <tr id="div_test" style="display:none;">
    <td width="50"></td>
    <td width="650">Dette er også en test</td>
  </tr>
</table>

和脚本:

function Reveal (it, box) 
{ 
    var vis = (box.checked) ? "block" : "none"; 
    document.getElementById(it).style.display = vis;
}


function Hide (it, box) 
{ 
    var vis = (box.checked) ? "none" : "none"; 
    document.getElementById(it).style.display = vis;
}

我在做什么错了?

推荐答案

您需要将display设置为table-row而不阻塞，因为它是表行！

You need to set the display to table-row not block because it's a table row!

http://jsfiddle.net/xsrdeuw4/

function Reveal (it, box) 
{ 
    var vis = (box.checked) ? "table-row" : "none"; 
    document.getElementById(it).style.display = vis;
}

这篇关于显示隐藏< tr>无法在Chrome和Firefox中使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！