js 点击图标隐藏层,再次点击显示层

发布网友发布时间：2022-05-16 13:59

我来回答

共5个回答

热心网友时间：2022-05-16 15:29

if 对象.style.display=='none' ? 对象.style.display='block' : 对象.style.display='none'

热心网友时间：2022-05-16 16:47

设置这个图标的onclick事件点击后执行一个匿名函数设置style。display为none。再设置一个点击html的onclick事件执行style。display为block

热心网友时间：2022-05-16 18:21

可以给图标绑定click事件在事件中通过css样式定义层的display属性

热心网友时间：2022-05-16 20:13

gt;
<head>
<script type="text/javascript">
function changeBody(index){
switch(index){
case 1:{
document.getElementById('iDBody1').style.display = "";
document.getElementById('iDBody2').style.display = "none";
document.getElementById('iDBody3').style.display = "none";
break;
}
case 2:{
document.getElementById('iDBody1').style.display = "none";
document.getElementById('iDBody2').style.display = "";
document.getElementById('iDBody3').style.display = "none";
break;
}
case 3:{
document.getElementById('iDBody1').style.display = "none";
document.getElementById('iDBody2').style.display = "none";
document.getElementById('iDBody3').style.display = "";
break;
}
}
}
</script>
</head>
<body>

<a href="javascript:changeBody(1)">模块A</a>
<a href="javascript:changeBody(2)">模块B</a>
<a href="javascript:changeBody(3)">模块C</a>

<div style="display: none" id="iDBody1">
模块(一)的相关内容
</div>
<div style="display: none" id="iDBody2">
模块(二)的相关内容
</div>
<div style="display: none" id="iDBody3">
模块(三)的相关内容
</div>
</body>
</html>