jquery - 在jQuery中使用数组旋转推荐

Question

http://jsfiddle.net/jdTL9/1/

我无法让它正常工作。它在错误的时间更改文本（如您在演示中所见）。我想我会以错误的方式解决这个问题（主要setTimeout是不必要的）。有人可以看看吗？

var testimonials = ['This', 'is', 'kind', 'of', 'working']

$.each(testimonials, function (i, val) {
  setTimeout(function () {
   //Slide In
    $('#testimonials blockquote').show("slide", {
      direction: "right"
    }, 1500, function () {
     //Slide Out
      $(this).text(val).hide("slide", {
          direction: "left"
      },
         1500);
    });
  }, i * 3000);
});

**我也希望它永远循环。

Answer 1

您应该在显示项目之前更改文本，可以在.hide()的回调中或之前show()。还稍微重构了您的逻辑以使用回调而不是setTimeout：

var testimonials = ['This', 'is', 'kind', 'of', 'working'],
    i = 0,
    l = testimonials.length,
    $el = $('#testimonials blockquote');
(function loopTestimonials() {
    $el.text(testimonials[i++ % l]).show("slide", {
        direction: "right"
    }, 500, function () {
        $(this).delay(2000) //milliseconds to stay in screen
        .hide("slide", {
            direction: "left"
        }, 500, loopTestimonials); //restart show/hide loop when hide completes
    });
}());

小提琴