Постоянно зацикливать массив JavaScript и отображать результаты в div?

Question

У меня есть куча отзывов для моего сайта, которые в данный момент находятся на странице, и я пытаюсь заставить div отображать каждые 1 с интервалом в 5 секунд, если массив достигает последнего значения, он должен начинаться с начала массив снова.

Вот что у меня есть ...

var testimonial = new Array();
testimonial[1] = "Rugby";
testimonial[2] = "Baseball";
testimonial[3] = "Cricket";
var length = testimonial.length
var i = 1;
setInterval(function() {
    while (i <= length) {   
        $('#testimonials p').html(testimonial[i]);
        ++i;
        if (i == length) {
            i == 1;
        }
    }
}, 5000);

Любая помощь была бы отличной, спасибо.

Answer 1

Попробуйте

var testimonial = ['Rugby', 'Baseball', 'Cricket'];
var numTestimonials = testimonial.length;
var index = 0;

setInterval(function() {
    $('#testimonials p').text(testimonial[index]);        
    index = (index + 1) % numTestimonials;
}, 5000);

Массивы JavaScript имеют индекс 0 и имеют удобный синтаксис литерала массива. Использование оператора модуля (%) является идиоматическим способом оборачивания счетчика обратно в 0, когда он достигает определенного значения.

Answer 2

Много интересных ответов, так что еще один не повредит.: -)

Вы можете объединить все это в сразу же вызванное выражение функции:

(function() { 
  var testimonials = ['Rugby', 'Baseball', 'Cricket'];
  var i = 0;
  setInterval(function() {
    $('#testimonials p').text(testimonials[++i % testimonials.length]);
  }, 5000);
}());

Answer 3

Функция в setInterval вызывается каждые 5 секунд.Это означает, что вы отображаете 5 рекомендаций один за другим очень быстро каждые 5 секунд вместо того, чтобы отображать их один за другим.

Вы должны сделать что-то вроде:

var testimonial = new Array();
testimonial[1] = "Rugby";
testimonial[2] = "Baseball";
testimonial[3] = "Cricket";
var length = testimonial.length
var i = 0; // arrays start with 0

setInterval(function() {
    $('#testimonials p').html(testimonial[i]);
    i++;
    if (i == length) i = 0;
}, 5000);

Answer 4

Вы можете попробовать

setInterval(function() { 
    $('div').html(test[  (i = (i + 1) % length)  ]) },
5000);