教程集 > jQuery > jquery 教程 > 正文 js 控制展开和关闭的窗口(显示隐藏层）

js 控制展开和关闭的窗口(显示隐藏层）

发布时间：2023-12-20 编辑：jiaochengji.com

教程集为您提供js 控制展开和关闭的窗口(显示隐藏层）等资源，欢迎您收藏本站，我们将为您提供最新的js 控制展开和关闭的窗口(显示隐藏层）资源

提示：您可以先修改部分代码再运行

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  <html xmlns="http://www.w3.org/1999/xhtml">  <head>  <title>js 控制展开和关闭的窗口(显示隐藏层）</title>  <meta http-equiv="content-type" content="text/html;charset=gb2312">    <style type="text/css">  #box,#box2,#box3,#box4{padding:10px;border:1px solid green;}  </style>  <script type="text/javascript">  //=点击展开关闭效果=  function openShutManager(oSourceObj,oTargetObj,shutAble,oOpenTip,oShutTip){  var sourceObj = typeof oSourceObj == "string" ? document.getElementById(oSourceObj) : oSourceObj;  var targetObj = typeof oTargetObj == "string" ? document.getElementById(oTargetObj) : oTargetObj;  var openTip = oOpenTip || "";  var shutTip = oShutTip || "";  if(targetObj.style.display!="none"){     if(shutAble) return;     targetObj.style.display="none";     if(openTip  &&  shutTip){      sourceObj.innerHTML = shutTip;      }  } else {     targetObj.style.display="block";     if(openTip  &&  shutTip){      sourceObj.innerHTML = openTip;      }  }  }  </script>  </head>  <body>    <p>点击展开</p>  <p id="box" style="display:none">这里面放的是box的内容</p>  <p>点击展开</p>  <p id="box2" style="display:none">这里面放的是box的内容</p>  <p>点击展开</p>  <p id="box3" style="display:none">这里面放的是box的内容</p>  <p><button onclick="openShutManager(this,'box4',false,'点击关闭','点击展开')">点击展开</button></p>  <p id="box4" style="display:none">这里面放的是box的内容</p>  </body>  </html>

提示：您可以先修改部分代码再运行

您可能感兴趣的文章：
jQuery pageSlide
jquery弹出窗口的实现代码分享
 jBox 2.3基于jquery的最新多功能对话框插件常见使用问题解答
 javascript控制层的显示与隐藏的代码
 JS父子窗口相互取值与赋值的方法参考
 解析jquery获取父窗口的元素
 javascript弹出对话框综合实例汇总
 jMessageBox 基于jQuery的窗口插件
 Javascript弹出窗口的多种方法
 jquery实现弹出窗口效果的实例代码

上一篇：鼠标移动到图片显隐的图片说明

[关闭]

js 控制展开和关闭的窗口(显示隐藏层）

最近更新

浏览排行