html中我想通过点击一个div标签的文字实现对一个表的隐藏和显示,以前用过js实现久了不用忘了
发布网友
发布时间:2022-04-19 06:11
我来回答
共4个回答
热心网友
时间:2022-04-19 07:41
首先给人员管理这个div一个id
然后设置这个表display属性为none
<div id="id1">人员管理</div>
<table id="table1" style="display: none">
<tr>
<td>增加</td>
<td>删除</td>
<td>修改</td>
<td>管理</td>
</tr>
</table>
<script type="text/javascript">
$(function () {
$('#id1').on("click", function () {
$('#table1').toggle();
});
//多表格 这继续取id
});
</script>
热心网友
时间:2022-04-19 08:59
<b onClick="show()">click</b>
<table id="t1">
<tr><td>1</td></tr>
<tr><td>2</td></tr>
<tr><td>3</td></tr>
</table>
<script>
function show(){
var t1=document.getElementById('t1');
if(t1.style.display=="none"){
document.getElementById('t1').style.display='block';
}else{
document.getElementById('t1').style.display='none';
}
}
</script>
追问如果我有两个表分别对应两个文字按钮,ID处应该怎么修改呢(table1:id=t1)(table2:id=t2)....对应的,不只一个表
热心网友
时间:2022-04-19 10:33
<div id="mg">人员管理</div>
<table id="tb">
<tr><td>人员增加</td></tr>
<tr><td>人员删除</td></tr>
<tr><td>人员管理</td></tr>
</table>
JS部分:
<script type="text/javascript">
<!--
var oDiv=document.getElementById("mg"); // 获取 div
var oTb=document.getElementById("td"); // 获取 表格
// 下面加事件
oDiv.onclick=function (){
if(oTb.style.display=="none"){
oTb.style.display="block"; // 显示表格
}else{
oTb.style.display="none"; // 隐藏表格
}
}
//-->
</script>
热心网友
时间:2022-04-19 12:25
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
#hidden{background:#F00; width:100px; height:30px;}
</style>
<script type="text/javascript">
function hiddenTab(){
var t=document.getElementById("tab");
if(t.style.display!="none")
t.style.display="none";
else
t.style.display="block";
}
</script>
</head>
<body>
<div id="hidden" onclick="hiddenTab();">人员管理</div>
<div id="tab">
<table width="100" height="100">
<tr><td>人员增加</td></tr>
<tr><td>人员删除</td></tr>
<tr><td>人员管理</td></tr>
</table>
</div>
</body>
</html>