1

Привет! есть html

<div class="litle">
   <a href="#" class="active" dat="1" style="background-image:url(/assets/components/phpthumbof/cache/Mers221-1-4.bb455f5600dc99ee2262a6f103f447cd251.jpg);"></a>
   <a href="#" dat="2" style="background-image: url(/assets/components/phpthumbof/cache/Mers221-2.bb455f5600dc99ee2262a6f103f447cd251.jpg);"></a>
   <a href="#" dat="3" style="background-image: url(/assets/components/phpthumbof/cache/Mers221-8.bb455f5600dc99ee2262a6f103f447cd251.jpg);"></a>
  <a href="#" dat="4" style="background-image: url(/assets/components/phpthumbof/cache/Mers221-6.bb455f5600dc99ee2262a6f103f447cd251.jpg);"></a>
  <a href="#" dat="5" style="background-image: url(/assets/components/phpthumbof/cache/Mers221-7.bb455f5600dc99ee2262a6f103f447cd251.jpg);"></a>
</div>

Как сделать поочередный клик на каждом из элементов с задержкой в 1 сек и весь этот процесс повторить заново при достижении последнего элемента? Пробовал это для обхода элементов (хотя бы один раз)

$('.litle a').each(function(){
setTimeout(function(){
$(this).click();
},1000);
});

И это

$('.productp .litle a').each(function(){
setTimeout(function(){
$(this).trigger('click');
},1000);
});

На элементы также навешен обработчик клика,который меняет картинки в слайдере. Потому я хочу пробежаться по элементам и увидеть поочередную смену картинок слайдера. этого не происходит и ошибок нет в консоли. ЧЯДНТ?

3
  • А что вы в итоге хотите получить, какой результат? 13 фев 2018 в 7:07
  • Написал же "Потому я хочу пробежаться по элементам и увидеть поочередную смену картинок слайдера". Т.е. я хочу увидеть как элементы по очереди становятся активными и картинка в слайдере меняется (это поведение прописано в обработчике клика на элемент).Разумеется, что просто клик на элемент работает и приводит к ожидаемому результату 13 фев 2018 в 7:11
  • Вот тепер понятно. Ваша цель - изменять активный слайд, двигать слайдер. То, что вы пытаетесь это сделать через вызов обработчика click - не совсем верно. Обычно у слайдеров есть специальный метод для изменения текущего слайда - лучше его использовать. Какой слайдер используете? 13 фев 2018 в 7:15

1 ответ 1

1

Можете так попробовать:

var $items = $('.litle a'),
    items_length = $items.length,
    i = 0;

$items.click(function(e){
  e.preventDefault();

  console.log($(this).attr('dat'))
});
setInterval(function(){
  if(i == items_length) {
    i = 0
  }

  $items.eq(i).click()

  i++

}, 1000)

https://codepen.io/anon/pen/NygLXE

5
  • Огромное спасибо, Юрий! копался я в setInterval и не сообразил как правильно ее юзать в моей задаче. После вашего кода стало понятнее. 13 фев 2018 в 7:15
  • Зря вы направляете на кривую дорожку)) 13 фев 2018 в 7:16
  • Степан, не дайте мне упустить вариант лучше, предложите,если знаете,пожалуйста) 13 фев 2018 в 7:17
  • Степан,не увидел вашего комментария выше. да,вы правы,тот же owlCarousel справился бы лучше. Я бы просто повесил на существующее событие смены слайда логику. Просто мне стала интересна именно моя реализация. Развития ради. А то никак не соображу 13 фев 2018 в 7:24
  • Stepan Kasyanenko, а в чем проблема такого подхода? (если не учитывать что там есть реальный слайдер, а по сути самого вопрроса) 13 фев 2018 в 7:25

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.