$('.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按钮点击展开收起的更多相关文章

  1. vue.js 实现点击展开收起动画

    最近公司项目加了个页面,其中要求是这样的,点击对应列表,展开和收起, 其实就是显示和隐藏内容部分:说来惭愧,我花了半天时间才搞出来(自黑一下~), ,,接下来分享给大家,先上效果图: .vue页面: ...

  2. Vue 实现点击展开收起

    Vue 展开收起功能实现 之前写项目的时候提到了一个需求 展开/收起 所有内容的需求 .因之前一值是重构,自己写功能还是比较少的,于是网上搜了一下,发现很多东西其实是jq的功能 虽然可以拿过来用,但是 ...

  3. 原生态js单个点击展开收缩

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. js按钮点击事件

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

  5. JS——按钮点击事件累加注册问题

    最近在工作上遇到一个点击事件累加的问题,为元素添加点击事件效果,但是总是效果失败,最后发现点击事件被执行了多次,上网查了一下,下边就是解决这个问题的几种思路 案列引自 踮起脚尖眺望6 $(" ...

  6. JS 实现点击展开菜单

    1: 获取事件源的两种方式 2: overflow 控制展现 <%@ page language="java" import="java.util.*" ...

  7. javasript简单实现文字的展开收起(无动画)

    今天在工作遇到展开和收起的需求,在网上找了很多方法,今天来写一下我觉得比较简单的方法 在项目中需要达到如图这种效果 首先想的是使用overflow简单且粗暴,在需要展开的的文字定义样式 { overf ...

  8. js 点击展开、收起

    //点击展开.收起 window.onload=function(){ var current=document.getElementsByTagName('li')[0]; document.bod ...

  9. js触发按钮点击事件

    js触发按钮点击事件 博客分类: javascript   模拟JS触发按钮点击功能 <html> <head> <title>usually function&l ...

随机推荐

  1. HttpClient(4.3.5) - HTTP Authentication

    HttpClient provides full support for authentication schemes defined by the HTTP standard specificati ...

  2. 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 ...

  3. pdf文件流生成pdf文件

    protected void Page_Load(object sender, EventArgs e) { if (!Page.IsPostBack) { Code.Login Starr_mode ...

  4. kettle学习-day1-介绍、下载、安装

    QQ群:306059317\ 技术支持:荷露叮咚网络学苑http://www.heludd.com/kettle 下载最新版,获取视频教程 kettle安装: 1).下载需要安装的kettle版本,官 ...

  5. 北大ACM(POJ1753-Flip Game)

    Question:http://poj.org/problem?id=1753 问题点:穷举. #include <iostream> using namespace std; ][];/ ...

  6. .Net平台开源作业调度框架Quartz.Net

    Quartz.NET介绍: Quartz.NET是一个开源的作业调度框架,是OpenSymphony 的 Quartz API的.NET移植,它用C#写成,可用于winform和asp.net应用中. ...

  7. (转)理解SQL SERVER中的分区表

    简介 分区表是在SQL SERVER2005之后的版本引入的特性.这个特性允许把逻辑上的一个表在物理上分为很多部分.而对于SQL SERVER2005之前版本,所谓的分区表仅仅是分布式视图,也就是多个 ...

  8. CSS 样式二

    CSS文本样式 text-align:设置文本的对齐方式 取值: left 向左对齐 right:向右对齐 center:居中对齐 text-indent:设置文本的首行缩进 例如,字体设为12px, ...

  9. 工具:linux 性能监控工具-nmon

    nmon 下载:http://pan.baidu.com/s/1jICoSpo 放到linux下可以直接运行. nmon 工具可以帮助在一个屏幕上显示所有重要的性能优化信息,并动态地对其进行更新. n ...

  10. spring中jdbc的配置

    本文中的JdbcTemplate的用法可以参看官方文档http://docs.spring.io/spring/docs/3.2.5.RELEASE/spring-framework-referenc ...