【jQuery02】点击标题面板显示内容
<!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></title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<style type="text/css">
*{margin:0px;padding:0px;}
body{font-size:12px;} .box{margin:10px;padding:10px;}
.box h3{margin:10px 0px;border-bottom:1px solid red;padding-bottom:10px;}
.box p{line-height:20px;} #panels{margin:10px;padding:10px;width:380px;}
#panels dt{height:30px;line-height:30px;padding-left:10px;border:1px solid #aaccff;font-weight:bold;font-size:14px;background-color:#bb44aa;margin-top:-1px;cursor:pointer;}
#panels dd{height:230px;padding:10px;line-height:20px;border:1px solid #aaccff;margin-top:-1px;} </style>
<script type="text/javascript" src="Scripts/jquery-1.4.1.js"></script>
<script type="text/javascript">
$(function(){
$("#panels dd:not(dd:first)").hide()
$("#panels dt").click(function(){ $("#panels dt").next().hide()
$(this).next().toggle()
})
})
</script> </head>
<body>
<div class="box">
<h3>试题要求:</h3>
<p>
.点击每组的标题时,显示该标题下的面板;同时隐藏其他的面板。<br />
.页面加载完毕后默认显示第一个标题下的面板。<br />
</p>
</div> <dl id="panels">
<dt>DotNet23</dt>
<dd>英雄们,该写作业了......</dd>
<dt>DotNet24</dt>
<dd>其实它只是个传说........</dd>
<dt>DotNet25</dt>
<dd>未完,待续......</dd>
<dt>DotNet26</dt>
<dd>此处省略一万字......</dd>
</dl> </body>
</html>

【jQuery02】点击标题面板显示内容的更多相关文章
- JS实现点击参数面板按钮显示或隐藏数据
当报表中列出数据太多时,想通过显示按钮隐藏明细数据只显示统计数据.如下图示例,那么该如何实现呢?本文以FineReport为例,来讲述JS如何实现点击参数面板按钮显示或隐藏数据. 打开报表 在参数面板 ...
- jquery如何实现点击标题收缩下面的内容
jquery如何实现点击标题收缩下面的内容 一.总结 一句话总结:怎么做复杂前端任务,先把样式(最简单)做出来,然后在写js. 1.如何取jquery集合中的某个索引号的元素? 不是get(),是eq ...
- 帆软报表(finereport)JS实现点击参数面板按钮显示或隐藏数据
当报表中列出数据太多时,想通过显示按钮隐藏明细数据只显示统计数据.如下图示例,那么该如何实现呢?本文以FineReport为例,来讲述JS如何实现点击参数面板按钮显示或隐藏数据. 打开报表 在参数面板 ...
- [python][django学习篇][12]继续设计博客首页,点击博客标题能显示文章的详情
回顾一下开发流程:配置url, 编写视图函数,编写对应模板 配置URL 首页视图匹配的 URL 去掉域名后,是一个空的字符串.每篇文章的详情有着不同的 URL,因此可以设计文章详情页面URl:< ...
- 搜索框focus 搜索面板显示 点击别处消失 从浏览器别的页面回来消失
开始是设置了回到页面使display:none(离开页面操作失效),但是发现回到页面,面板显示,dom获取却为null,于是做了个延时的处理 currentPage: function() { var ...
- python 全栈开发,Day126(创业故事,软件部需求,内容采集,显示内容图文列表,MongoDB数据导入导出JSON)
作业讲解 下载代码: HBuilder APP和flask后端登录 链接:https://pan.baidu.com/s/1eBwd1sVXTNLdHwKRM2-ytg 密码:4pcw 如何打开APP ...
- 软件部需求,内容采集,显示内容图文列表,MongoDB数据导入导出JSON
全局变量 由于多个html页面,需要引用同一个变量.这个时候,需要定义一个全局变量!如何定义呢? 默认包含了mui的html文件都导入mui.js文件.那么将变量写在mui.js中,就可以实现所有页面 ...
- javascript学习内容--改变样式、取消设置、显示内容、隐藏内容
<head> <style> body{font-size:12px;} #txt{ height:400px; width:600px; border:#333 solid ...
- dede顶级栏目直接显示内容
点击网站栏目管理,增加顶级栏目 在弹出的增加窗口中,填上栏目名称,其它的如果没有特殊的要求可直接默认 点击常规选项旁边的高级选项,并且在列表模板中,将其改一个文件名,这个文件名就是后面需要使用到的文件 ...
随机推荐
- CF1041E Tree Reconstruction_构造_思维题
不难发现,每次询问结果一定是 (i,n)(i,n)(i,n), 而 iii 出现的次数恰好是 iii 到 i′i'i′ 的距离(i′i'i′ 是第一个不与 iii 相等的数).我们可以将这颗树构造成一 ...
- 为什么密信MeSince采用S/MIME加密?
S/MIME是Secure/Multipurpose Internet Mail Extensions (安全多用途互联网邮件扩展协议)的缩写,是采用PKI技术的用数字证书给邮件主题签名和加密的国标标 ...
- HDU 1028 Ignatius and the Princess III(母函数整数拆分)
链接:传送门 题意:一个数n有多少种拆分方法 思路:典型母函数在整数拆分上的应用 /********************************************************** ...
- [CodeForces]529B Group Photo 2
AK爷GhostCai的电脑又蓝屏了Orz 贪心题,确定一个maxh,限定h不大于一个值.枚举maxh. check的时候的细节很多: 1.h>maxh但w<maxh交换的时候需要占用交换 ...
- python_三级字典
data = { "北京":{ "昌平":{ "沙河":["oldboy","test"], &qu ...
- sql 语句中的 (+) 是什么意思?
在select语句中(+)指的是外连接,是连接查询的一种方法.例:select t1.*,t2.* from dept t1,emp t2 where t1.deptno=t2.deptno(+);其 ...
- 在Action中获取servlet API
Struts2的Action组件是不依赖servlet API 的.那么当你在action中的业务需要处理HttpServletRequest和HttpServletResponse的时候(比如要对响 ...
- jquery在文本框之后添加红*
var addHtml="<span class='text_red'>*</span>";function req(re){ if(re.parent(& ...
- jQuery判断浏览器类型和版本
jquery 判断浏览器类型 例: if($.browser.msie) { alert("这是一个IE浏览器"); }else if($.browser.opera) { a ...
- HDU 5416 CRB and Tree (2015多校第10场)
欢迎參加--每周六晚的BestCoder(有米!) CRB and Tree Time Limit: 8000/4000 MS (Java/Others) Memory Limit: 65536 ...