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 ...
随机推荐
- HttpClient(4.3.5) - HTTP Authentication
HttpClient provides full support for authentication schemes defined by the HTTP standard specificati ...
- MyBatis(3.2.3) - One-to-one mapping using nested Select
We can get Student along with the Address details using a nested Select query as follows: <result ...
- pdf文件流生成pdf文件
protected void Page_Load(object sender, EventArgs e) { if (!Page.IsPostBack) { Code.Login Starr_mode ...
- kettle学习-day1-介绍、下载、安装
QQ群:306059317\ 技术支持:荷露叮咚网络学苑http://www.heludd.com/kettle 下载最新版,获取视频教程 kettle安装: 1).下载需要安装的kettle版本,官 ...
- 北大ACM(POJ1753-Flip Game)
Question:http://poj.org/problem?id=1753 问题点:穷举. #include <iostream> using namespace std; ][];/ ...
- .Net平台开源作业调度框架Quartz.Net
Quartz.NET介绍: Quartz.NET是一个开源的作业调度框架,是OpenSymphony 的 Quartz API的.NET移植,它用C#写成,可用于winform和asp.net应用中. ...
- (转)理解SQL SERVER中的分区表
简介 分区表是在SQL SERVER2005之后的版本引入的特性.这个特性允许把逻辑上的一个表在物理上分为很多部分.而对于SQL SERVER2005之前版本,所谓的分区表仅仅是分布式视图,也就是多个 ...
- CSS 样式二
CSS文本样式 text-align:设置文本的对齐方式 取值: left 向左对齐 right:向右对齐 center:居中对齐 text-indent:设置文本的首行缩进 例如,字体设为12px, ...
- 工具:linux 性能监控工具-nmon
nmon 下载:http://pan.baidu.com/s/1jICoSpo 放到linux下可以直接运行. nmon 工具可以帮助在一个屏幕上显示所有重要的性能优化信息,并动态地对其进行更新. n ...
- spring中jdbc的配置
本文中的JdbcTemplate的用法可以参看官方文档http://docs.spring.io/spring/docs/3.2.5.RELEASE/spring-framework-referenc ...