Question

我试图改变一行元素的可见性。我应该只在用户选择按钮时显示元素。

HTML code：

  <tr style="display:none">
      <td><input type="submit" value ="Home" onclick="" id="home"/></td>
      <td><input name="home_phone" id="home_phone" type="text" value="Phone" ></td>
  </tr>

JS代码：

 document.getElementById("home").style.display = '';
 document.getElementById("home_phone").style.display = '';

我试图使用HTML和JS来实现这个目标。

Answer 1

您的JavaScript代码是正确的。

问题是您要为嵌套在隐藏元素中的元素设置显示值。您必须更改<tr>的样式，因为它是隐藏的元素。

HTML code：

<a href="javascript:toggleRow('home_row');">toggle home row visibility</a>

<table>
   <tr id="home_row">
      <td><input type="submit" value ="Home" onclick="" id="home"/></td>
      <td><input name="home_phone" id="home_phone" type="text" value="Phone" ></td>
   </tr>
</table>

JS代码：

function toggleRow(rowId){
    var rowElement = document.getElementById(rowId);
    rowElement.style.display = rowElement.style.display.toLowerCase() == 'hidden'
                               ? 'table-row'
                               : 'hidden';
}

无法更改HTML元素的可见性

1 个答案: