jquery问答显示隐藏当前列表

来源:互联网 发布:软件项目经理培训班 编辑:程序博客网 时间:2024/06/05 07:14

jquery问答显示隐藏当前列表

index.html

<div class="margin-t-40 customer-question" id="problem">        <ul >            <li><span class="customer-question-ico margin-r-20"></span>需要多长时间开立一个基本帐户?                <span  class="fr customer-question-plus plus" ></span>                <div  class="answer">1天左右就可以搞定</div>            </li>            <li>                <span class="customer-question-ico margin-r-20"></span>为什么当尝试上传我的文件时,注册页面到期?                <span  class="fr customer-question-plus plus" ></span>                <div  class="answer ">你想多了,根本不会有这种情况</div>            </li>            <li>                <span class="customer-question-ico margin-r-20"></span>我的资金存在BKL,安全吗?                <span  class="fr customer-question-plus plus" ></span>                <div  class="answer ">放心吧,绝对安全!</div>            </li>            <li><span class="customer-question-ico margin-r-20"></span>                为什么当尝试上传我的文件时,注册页面到期?<span class="fr customer-question-plus plus" ></span>                <div  class="answer">放心吧,以后不会有到期的!</div>            </li>            <li> <span class="customer-question-ico margin-r-20"></span>                流册流程在三分之二步时停止,页面冻结,应该怎么做?<span class="fr customer-question-plus plus" ></span>                <div  class="answer">继续注册,到成功为止!</div>            </li>            <li> <span class="customer-question-ico margin-r-20"></span>                我的资金存在BKL,安全吗?<span class="fr customer-question-plus plus" ></span>                <div  class="answer">请放心,我们有私保,绝对安全!</div>            </li>        </ul>    </div>

index.js

//FAQ问答JQuery$(function () {    var npage=0;                                        //当前页初始值    $('.plus').click(function () {              //+加号按钮单击事件        if($('.plus').index(this)==npage){        //判断是否是当前页是执行下面的内空            //点击是当前页时判断是加号还是减号(加号表示隐藏,减号表示显示)            $(this).parent().find('.answer').toggle();  //点击的是当前页就来回显示隐藏切换            if($(this).hasClass('customer-question-plus')){                $(this).removeClass().addClass('fr plus customer-question-minus'); //把加号变成减号            }else{                $(this).removeClass().addClass('fr plus customer-question-plus');   //把减号变成加号            }        }else{ //不是当前页时            $('.answer').hide(); //将所有的隐藏初始化            $('.plus').removeClass().addClass('fr plus customer-question-plus');//将所有的变成+加号初始化            $(this).parent().find('.answer').toggle();  //点击来回显示隐藏切换            if($(this).hasClass('customer-question-plus')){                $(this).removeClass().addClass('fr plus customer-question-minus');//把加号变成减号            }else{                $(this).removeClass().addClass('fr plus customer-question-plus');//把减号变成加号            }        }        npage=$('.plus').index(this);//把当前点击过的索引赋给当前页索引变量    });});

首发地址:http://www.jianshu.com/p/f2e10fbdeef9 个人qq:2675142924

0 0