今天要说一个神奇的html标签op，静态页下可以配合jquery分别控制每个层的显示/隐藏切换。

如果用动态中使用，用文章id做区分就可以了。

 <html>

 <head>

 <title>多个div独立控制其显示/隐藏</title>

 <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>

 </head>

 <script>

 $(document).ready(function(){

     $(".dj").click(function(){

         var op = $(this).attr("op");

         $("#list_"+op).toggle();

     });

 })

 </script>

 <body>

 <div class="info_tit">展开：<span op="1" class="dj">+</span></div>

     <div id="list_1" class="info_main" style="display:none">

         隐藏内容。

     </div>

 <hr />

 <div class="info_tit">展开：<span op="2" class="dj">+</span></div>

     <div id="list_2" class="info_main" style="display:none">

         隐藏内容。

     </div>

 </body>

 </html>

多个div独立控制其显示/隐藏的更多相关文章

  1. angular学习笔记(八)-控制视图显示隐藏

    本篇介绍angular控制视图的显示和隐藏: 通过给元素添加ng-show属性或者ng-hide属性来控制视图的显示或隐藏: ng-show: 绑定的数据值为true时,显示元素,值为false时,隐 ...

  2. JQuery 控制元素显示隐藏

    JS在浏览器里面做调试的时候,先在浏览器里面找到页面代码加上断点来执行.然后根据执行情况来查找部分变量是否能找到,一点一点的排查内容.可以做筛选条件 部分隐藏.默认让部分条件加上.hide 默认隐藏, ...

  3. python控制窗口显示隐藏

    import win32con # 定义 import win32gui # 界面 import time # 时间 QQ= win32gui.FindWindow("TXGuiFounda ...

  4. jQuery控制TR显示隐藏

    参考链接:http://www.jb51.net/article/51221.htm 通过jQuery的hide和show方法即可.

  5. jQuery动画之显示隐藏动画

    1. 显示动画 以下面一个代码示例: <!doctype html> <html lang="en"> <head> <meta char ...

  6. vue+element-ui实现显示隐藏密码

    <template> <el-form :model="cuser_info" label-width="115px" label-posit ...

  7. jQuery实现复选框的全选、反选、并且根据复选框的<checked属性>控制多个对应div的显示/隐藏

    <!doctype html><html> <head> <meta charset="utf-8"> <title>j ...

  8. python 全栈开发，Day50(Javascript简介,第一个JavaScript代码,数据类型,运算符,数据类型转换,流程控制,百度换肤,显示隐藏)

    一.Javascript简介 Web前端有三层: HTML:从语义的角度,描述页面结构 CSS:从审美的角度,描述样式(美化页面) JavaScript:从交互的角度,描述行为(提升用户体验) Jav ...

  9. 前端JavaScript(1) --Javascript简介,第一个JavaScript代码,数据类型,运算符,数据类型转换,流程控制,百度换肤,显示隐藏

    一.Javascript简介 Web前端有三层: HTML:从语义的角度,描述页面结构 CSS:从审美的角度,描述样式(美化页面) JavaScript:从交互的角度,描述行为(提升用户体验) Jav ...

随机推荐

  1. uuid_short() 源代码

    /* uuid_short handling. The short uuid is defined as a longlong that contains the following bytes: B ...

  2. WSGI是一种编程接口，而uwsgi是一种传输协议

    http://uwsgi-docs.readthedocs.io/en/latest/Nginx.html http://sunxiunan.com/?p=1778 cgi---------fastc ...

  3. careercup-递归和动态规划 9.1

    9.1 有个小孩正在上楼梯,楼梯有n阶台阶,小孩一次可以上1阶.2阶或3阶.实现一个方法,计算小孩有多少种上楼梯的方法. 解法: 我们可以采用自上而下的方式来解决这个问题.小孩上楼梯的最后一步,也就是 ...

  4. Cookie中图片的浏览记录与cookie读取servle时路径的设置（文字描述）

    public class ShowServlet extends HttpServlet { public void doGet(HttpServletRequest request, HttpSer ...

  5. .Net设计模式_原型模式

    引言: 原型,感觉就是拷贝,只是给拷贝分了深拷贝和浅拷贝. 理解: 在C#.Net里面,我们可以很容易的通过Clone()方法实现原型模式. 任何类,只要想支持克隆,必须实现C#中的ICloneabl ...

  6. 破解C#的readonly只读字段

    破解C#的readonly只读字段 目录 请允许我再唠叨几句const和readonly 修改readonly字段: 计策1:反间计 -- 反射修改 计策2:借刀杀人--调节字段偏移位置的结构体来修改 ...

  7. xml_03

    1.xml 2.对于XML文档的约束   |-DTD      <!DOCTYPE 根元素 [       <!ELEMENT 元素名 (xx)>       <!ATTLIS ...

  8. 读《编写高质量代码：改善JavaScript程序的188个建议》1

    建议3:减少全局变量污染 定义全局变量有3种方式: ❑在任何函数外面直接执行var语句. var f='value'; ❑直接添加一个属性到全局对象上.全局对象是所有全局变量的容器.在Web浏览器中, ...

  9. JAVA的instanceOf什么时候用啊

    当你拿到一个对象的引用时(例如参数),你可能需要判断这个引用真正指向的类.所以你需要从该类继承树的最底层开始, 使用instanceof操作符判断,第一个结果为true的类即为引用真正指向的类. cl ...

  10. Struts1和Struts2的区别和对比（完整版）

    Struts2其实并不是一个陌生的Web框架,Struts2是以Webwork的设计思想为核心,吸收了Struts1的优点,因此,可以认为Struts2是Struts1和Webwork结合的产物. 简 ...