没有next()怎么能回到开头

Question

没有next()怎么能回到开头

$(function () {
  (function hideHeading() {
    setInterval(function () {
      $('.active').fadeOut(2000, function () {
        $(this).removeClass('active').next().addClass('active').fadeIn(2000);
      });
    }, 2000);
  })();
});

例子在这里

http://codepen.io/OsamaElzero/pen/LVeLeY

Answer 1

检查 next 是否为元素，如果不是，则选择第一个兄弟元素。

var elem = $(this).removeClass('active')
var next = elem.next();
if(next.length===0) {
    next = elem.siblings().first();
}
next.addClass('active').fadeIn(2000);

Answer 2

您实际上不需要 setInterval ，因为您可以简单地进行如下递归。 如果.next()不存在，请将指针设置为first() 。

$(function () {
    (function hideHeading() {
        $(".active").fadeOut(2000, function () {
            var $this = $(this).removeClass('active');
            var $next = ($this.next().length && $this.next()) || ($this.siblings().first());
            $next.addClass('active').fadeIn(2000, hideHeading);
        });
    }());
});

更新笔