Временные события Jquery с использованием .each

Question

Я пытаюсь смоделировать событие щелчка по элементам списка с одним и тем же классом, по одному каждые несколько секунд.Я пробовал это много разных способов.Использование комбинаций .each и delay () приводит к одновременному срабатыванию всех кликов.Я нашел кого-то с похожим вопросом, и ответ был следующим:

            var elements = $(this).find('.slide');
            var index = 0;

            setTimeout(function () {
                $(elements).get(index).trigger("click");
                index++;
            }, 3000);

Это каждый раз выдает ошибку js и, похоже, не заполняет массив ... может быть, я 'Я упускаю что-то очевидное ...

Спасибо

Answer 1

Вот совершенно неконтекстный код, как я бы вызывал клик на .list-elements каждую 1 секунду, используя рекурсивный тайм-аут

 (function(){
var listElements = jQuery( ".list-elements" ), i = 0;

     function triggerClick(){

        if( listElements[i] ) {
        listElements.eq( i++ ).trigger( "click" );
        window.setTimeout( triggerClick, 1000 );
        }

     }
window.setTimeout( triggerClick, 1000 );
 })()

Answer 2

jQuery.fn.delay() работает только для анимации, созданной с помощью jQuery, пока нет возможности отложить код с использованием ядра jQuery. Однако есть плагины, реализующие setTimeout() и подобные в jQuery, но они не добавляют много функциональности по сравнению с оригинальным setTimeout().

Что касается исправления вашего кода;)
jQuery.fn.get() получает фактический HTMLDomElement, и у него нет метода .click(). (Я ожидаю, что это ошибка, которую вы получаете.) Используйте взамен jQuery.fn.eq(). Кроме того, используйте setInterval() вместо setTimeout(), чтобы он работал несколько раз, а затем, когда все «нажали», очистите интервал:

var interval = setInterval(function () {
  elements.eq(index).trigger("click");
  index++;
  if(index == elements.size()){
    clearTimeout(interval);
  }
}, 3000);

Answer 3

В вашем примере клик должен срабатывать только один раз, потому что у вас нет рекурсии.

Попробуйте следующее:

$(this).find('.slide').each(function(index) {
    $(this).delay(3000 * index).click();
}); 

Вы создадите все таймауты одновременно, но с разнымипериод.