如何选择活动幻灯片？（通过 if 条件）答案

【问题标题】：How to choose the active slide? (by if-condition)如何选择活动幻灯片？（通过 if 条件）
【发布时间】：2014-01-31 08:58:59
【问题描述】：

我有 2-3 个 div 标签，每个标签都有不同的内容。并且有一个next按钮可以淡出当前的div并淡入下一个。

这是我想要做的，但它不完整并且可能是错误的。

 $(".slide2").hide();
       var active = $(".slide1").hide();

       $('.next').click(function(){
          if(active == true){
              $('.slide2').fadeIn(1000)
          }
          else{
              $('.slide1').fadeIn(1000)
          }
        });

那么有什么办法可以淡出当前幻灯片并淡入另一张幻灯片吗？

【问题讨论】：

我在您的问题中没有看到任何 CSS（也没有 CSS3）。为什么要这样标记它？
@Bergi Yh 我的代码中没有 CSS，但我认为 CSS 可能有助于解决这个问题。就像使用display:none 的第一个答案一样。 ;)

标签： javascript jquery

【解决方案1】：

你可以试试这个： HTML：

<div id="one" class="accordion">How</div>
<div id="two" style="display:none" class="accordion">It's</div>
<div id="three" style="display:none" class="accordion">Done</div>
<input type="button" id="go" value="next">

JavaScript：

$('#go').on('click',function(evt){
    var active = $('.accordion:visible');
    var nextElement = active.next();
    active.hide();
    if(nextElement.hasClass("accordion")){
        nextElement.fadeIn(1000);
    }else{
       $('.accordion:first').fadeIn(1000);
    } 
});

小提琴：http://jsfiddle.net/theinnkeeper/yDnBX/1/

【讨论】：