js按钮点击展开收起
$('.tab').click(function(){
var index = $('.tab').index(this), //缓存第一次点击的li的索引值
ele = $(this).find('.ind');
$('.tab').each(function(i){
if(i != index){ //缓存索引值不等于他本身的索引值
$(this).find('.ind').hide();
}
});
if(ele.is(':hidden')){
ele.show();
}else{
ele.hide();
}
});
// $(".tab").click(function(){
// var index = $('.tab').index(this),
// ele = $(this).find('.ind');
// $(".tab").each(function(i){
// if( i != index){
// $(this).children(".ind").removeClass("cur");
// }
// });
// if($(this).children(".ind").hasClass("cur")){
// $(this).children(".ind").removeClass("cur");
// }else{
// $(this).children(".ind").addClass("cur");
// }
// })
html
<ul class="rank">
<li class="first1 tab" id="tab2"><p class="list"><span>双线15区</span><i>不醉</i><em></em></p>
<div class="ind" id="ind2">
<p><code>入选理由</code><strong>布衣非凡人,然万事低调</strong></p> <p><code>七夜评</code><strong>不醉,算是一个玩家群都比较熟悉的玩家,游戏的骨灰级,操作级选手。<br>热爱游戏,从游戏中寻找快乐,从游戏中找寻兄弟!游戏之殇,不外乎今非昔比,朝花夕拾!<br>不醉,如今已经物是人非,几经转手,然,兄弟们依旧在等你!</strong></p>
</div>
<li class="second2 tab"><p class="list"><span>虚位以待</span><i>虚位以待</i><em></em></p>
<div class="ind">
<p><code>入选理由</code><strong>2144平台首位圣主宰装备集大成者<br>“风云争霸天下”称号首位获得者</strong></p>
<p><code>七夜评</code><strong>敢为天下先,誓做真英雄<br>XX是一个低调又奢侈的人,他不在意别人的风言风语,只为自己和兄弟能开心的游戏;有人说,这么好的装备干嘛不抢boss,他说:侠之大者,有可为,有不为。其实,他放眼的是全平台!<br>“我是要成为斗帝的男人”,加油,谜一样的男人!</strong></p>
</div>
<li class="third2"><p class="list"><span>虚位以待</span><i>虚位以待</i><em></em></p>
<div class="ind">
<p><code>入选理由</code><strong>2144平台首位圣主宰装备集大成者<br>“风云争霸天下”称号首位获得者</strong></p>
<p><code>七夜评</code><strong>敢为天下先,誓做真英雄<br>XX是一个低调又奢侈的人,他不在意别人的风言风语,只为自己和兄弟能开心的游戏;有人说,这么好的装备干嘛不抢boss,他说:侠之大者,有可为,有不为。其实,他放眼的是全平台!<br>“我是要成为斗帝的男人”,加油,谜一样的男人!</strong></p>
</div>
</ul>
js按钮点击展开收起的更多相关文章
- vue.js 实现点击展开收起动画
最近公司项目加了个页面,其中要求是这样的,点击对应列表,展开和收起, 其实就是显示和隐藏内容部分:说来惭愧,我花了半天时间才搞出来(自黑一下~), ,,接下来分享给大家,先上效果图: .vue页面: ...
- Vue 实现点击展开收起
Vue 展开收起功能实现 之前写项目的时候提到了一个需求 展开/收起 所有内容的需求 .因之前一值是重构,自己写功能还是比较少的,于是网上搜了一下,发现很多东西其实是jq的功能 虽然可以拿过来用,但是 ...
- 原生态js单个点击展开收缩
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- js按钮点击事件
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- JS——按钮点击事件累加注册问题
最近在工作上遇到一个点击事件累加的问题,为元素添加点击事件效果,但是总是效果失败,最后发现点击事件被执行了多次,上网查了一下,下边就是解决这个问题的几种思路 案列引自 踮起脚尖眺望6 $(" ...
- JS 实现点击展开菜单
1: 获取事件源的两种方式 2: overflow 控制展现 <%@ page language="java" import="java.util.*" ...
- javasript简单实现文字的展开收起(无动画)
今天在工作遇到展开和收起的需求,在网上找了很多方法,今天来写一下我觉得比较简单的方法 在项目中需要达到如图这种效果 首先想的是使用overflow简单且粗暴,在需要展开的的文字定义样式 { overf ...
- js 点击展开、收起
//点击展开.收起 window.onload=function(){ var current=document.getElementsByTagName('li')[0]; document.bod ...
- js触发按钮点击事件
js触发按钮点击事件 博客分类: javascript 模拟JS触发按钮点击功能 <html> <head> <title>usually function&l ...
随机推荐
- ORACLE之PACKAGE
刚学pl/sql编程,写了两个package.pkg_temp_fn和pkg_temp_fn2.内容涉及pl/sql基本语法,游标,存储过程(in,out),函数(有返回值). pkg_temp_fn ...
- 第一篇:groovy对DSL的语法支持
引子 我们用一段gradle的脚本做引子,理解这一段脚本与一般的groovy代码是怎么联系起来的 buildscript { repositories { jcenter() mavenLocal() ...
- Android PullToRefresh下拉刷新控件的简单使用
PullToRefresh这个开源库早就听说了,不过一直没用过.作为一个经典的的开源库,我觉得还是有必要认识一下. 打开github上的网址:https://github.com/chrisbanes ...
- 32位和64位Ghost版Win8.1系统大全下载最新版
Ghost版Win8.1系统企业版,下载完成后一定要使用校验工具验证GHO文件MD5值,如果不符请不要安装,不然安装失败后果自负.GHO文件路径一定不要带中文,否则无法安装.安装完成第一次进入桌面会黑 ...
- CSS 文字溢出时的自动隐藏
http://www.111cn.net/cssdiv/css/34050.htm 语法:overflow : visible | auto | hidden | scroll visible::不剪 ...
- Eclipse Code Templates设置
从工作开始,经历了几个项目的开发,现在的项目一般都是一个团队共同开发,而每个人都有自己的编码习惯,为了统一格式,项目组在项目开发之前都会制定一系列的规范.俗话说约定优于配置,但是在执行过程中往往发现效 ...
- Shell 循环读取文件
使用Shell将Windows环境下的文件拷贝到Linux下面的用法. 在linux下,将dos文件格式转换成linux文件格式的用法,vi打开,然后转到命令格式,执行,然后保存,就可以转换成linu ...
- 我对c++对象内存布局的理解
引言 结合网上的一些资料,通过自己的一番摸索,得出了一点个人见解.现在写下来,希望与各位同学共同探讨,共同进步. 以下所有代码均是在VS2012下测试. 一个普通的基类 1: #include < ...
- 深度探索C++对象模型读书笔记(2)
以下测试平台均为vs 2012 指向Data Member的指针测试(1) #include <stdio.h> class Base1 { public: int val1; int v ...
- 关于fputs和fgets的几个细节
C语言中两个标准IO fputs和fgets都是针对行来进行数据的读取的!这里关于这两个IO函数我有几个小细节想在这里和大家分享一下,希望能够对大家产生帮助! 首先贴上这两个函数的函数声明,下面以这两 ...