javascript - 折叠许多部分

标签 javascript html

我想在一个页面上有很多折叠部分,目前我可以像这样折叠一个部分,但是我怎么会有很多折叠部分呢?我是否必须为每个可折叠部分编写一个新函数?当我当前的代码根据节 ID 折叠节时。

这里是一些基本上是我所拥有的代码:

<html>
<body>

Some text before

<div id=tbl name=tbl style="overflow:hidden;display:none">
<table border=1>
<tr><td>test</td></tr>
<tr><td>test</td></tr>
<tr><td>test</td></tr>
</table>
</div>

some text after

<script language="JavaScript" type="text/javascript">
<!--
function sizeTbl(h) {
  var tbl = document.getElementById('tbl');
  tbl.style.display = h;
}
// -->
</script> 
<br>
<a href="javascript:sizeTbl('none')">Hide</a>

<a href="javascript:sizeTbl('block')">Expand</a>

</body>
</html>

最佳答案

将大小调整函数更改为:

function sizeTbl(h, id) {
  var tbl = document.getElementById(id);
  tbl.style.display = h;
}

然后将您希望它在调用时控制的部分的 id 传递给它,如下所示:

<a href="javascript:sizeTbl('none', 'tbl')">Hide</a>

<a href="javascript:sizeTbl('block', 'tbl')">Expand</a>

关于javascript - 折叠许多部分,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31996484/

相关文章:

html - 为什么更改元素的宽度会影响其兄弟元素?

html - 如何使元素背景在溢出时可见?

javascript - ajax 回调 window.location 请求中止

javascript - 在浏览器调整大小时更改超链接位置

javascript - 如何根据值为 HTML 表格单元格着色

javascript - 当 method=get 且 URL 包含散列时,使用 Javascript 更改表单操作时 IE 中的错误

jquery - 动态页面导航元素对齐

javascript - 检索所有命名的 ES6 导入

html - 底部的导航栏,居中 - CSS

javascript - Jquery Array 重复记录在 tr 迭代中