今天要说一个神奇的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. 第一篇：GPU 编程技术的发展历程及现状

    前言 本文通过介绍 GPU 编程技术的发展历程,让大家初步地了解 GPU 编程,走进 GPU 编程的世界. 冯诺依曼计算机架构的瓶颈 曾经,几乎所有的处理器都是以冯诺依曼计算机架构为基础的.该系统架构 ...

  2. Servlet中的转发

    public class OneServlet extends HttpServlet { public void doGet(HttpServletRequest request, HttpServ ...

  3. Android（java）学习笔记139：在TextView组件中利用Html插入文字或图片

    首先我们看看代码: 1.activity_main.xml: <LinearLayout xmlns:android="http://schemas.android.com/apk/r ...

  4. 导出EXCEL数据时防止数值变科学计数的办法

    网上有很多说法,最简单直接正确的做法是判断一下是否为数值以及长度,然后给单元格加上以下CSS即可: mso-generic-font-family:auto;   mso-font-charset:1 ...

  5. PHP正值表达式

    一个正值表达式是有四部分组成分别是 1.定界符 //是最常用的定界符 其实除了数组字母下划线以外其他的什么都可以作为定界符 2.原子:最小的一个匹配单位 放在定界符中  在一个正值表达式中至少要有一个 ...

  6. SQL Server数据的导入导出

    SQL Server 2008的导入导出服务可以实现不同类型的数据库系统的数据转换.为了让用户可以更直观的使用导入导出服务,微软提供了导入导出向导.导入和导出向导提供了一种从源向目标复制数据的最简便的 ...

  7. 快速预览：C# 3.0的新东西

    Lambda 表达式: Func<string, string> doubleAppend= x => x + x; Console.WriteLine (doubleAppend( ...

  8. 命令精解之DOS批处理

    前言 最近对于批处理技术的探讨比较热,也有不少好的批处理程序发布,但是如果没有一定的相关知识恐怕不容易看懂和理解这些批处理文件,也就更谈不上自己动手编写了,古语云:“授人以鱼,不如授人以渔.”因为网上 ...

  9. iOS afnetworking最新版报错 没有AFHTTPRequestOperationManager类了

    今天开了一个小项目   用的是pod   然后  安装好 Afnetworking之后   发现 AFHTTPRequestOperationManager  这个类没有了  ,百度之后  发现 原来 ...

  10. facebook登录(集成FBSDKLoginKit) result的isCancelled总是YES token为nil

    只需要在AppDelegate如下函数添加: - (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDict ...