Question

我有一个链接在点击时显示/隐藏div中的内容，我尝试做的是有一个按钮，隐藏div中的特定div（sectiontohide1中的内容）（sectiontohide）点击后。我已经让Javascript在第一个链接（sectiontohide）工作，但它可以工作，但我无法弄清楚如何获取隐藏div的第二个链接

<a id="trackAttendance1"  onclick="loadtable('sectiontohide');"      class="trackAttendance" href="#">Track Absences</a>
<div id="sectiontohide" style="display:none;">
<table>
    <div id="sectiontohide1">
         <tr>
             <td>Web Programming Seminar</td>
             <th id="absent" rowspan="2">Absent</th>
         </tr>
         <tr>
              <td>TUESDAY 2:00-3:00 - 21/02/2017</td>
         </tr>
    </div>

        <td>Management in IT</td>
        <th id="absent" rowspan="2">Absent</th>

        <tr>
        <td>FRIDAY 9:00-11:00 - 24/02/2017</td>
        </tr>

    <tr>
        <td>Web Programming Lecture</td>
        <th id="absent" rowspan="2">Absent</th>
    </tr>
        <tr>
        <td>FRIDAY 12:00-1:00 - 24/02/2017</td>
      </tr>
</table>

<a id="trackAttendance1"  onclick="hidediv('sectiontohide1');" class="close"     href="#">Hide Element</a>

我的Javascript用于显示/隐藏表格

 function loadtable(id){
 var divelement = document.getElementById(id);

 if(divelement.style.display =='none')
 divelement.style.display = 'block';
 else
    divelement.style.display = 'none';
}

Answer 1

看起来你走在正确的轨道上。只需hide div，尝试类似：

function hidediv(id) {
  var divelement = document.getElementById(id);
  divelement.style.display = 'none';
}

Answer 2

您的loadtable函数实际上按给定的ID切换元素的可见性。

所以你可以运行它来显示/隐藏其他部分。为此，将关闭按钮的点击处理程序更改为loadtable('sectiontohide1');

就足够了

但也有一些其他问题，例如：

只有当div被<td></td>或<th></th>
<th>标记用于标题，因此只能在表格顶部使用它，您可以使用css为单元格设置样式
<td>和<th>代码应始终由<tr></tr>

Onclick隐藏div元素

2 个答案: