Как сделать цикл в JQuery?

Question

<script>
  $(function() {
    $('#slideshow').crossSlide({
      sleep: 2,
      fade: 1
    }, [
      { src: 'picture1.jpg' },
      { src: 'picture2.jpg' },
    ])
  });
</script>

В этом сценарии я применяю эффект crossSlide к #slideshow. Однако что, если у меня есть 20 div, и я хочу применить эффект crossSlide к каждому div с классом «слайд-шоу»?

Как мне пройти через div, найти те с классом .slideshow и применить соответствующее изображение к каждому?

Редактировать: у каждого элемента есть свое изображение, которое я хочу показать.

Answer 1

Используйте селектор класса в сочетании с селектором элемента .

$('div.slideshow').crossSlide

Тогда у вас будетиспользовать .each() на элементах и ​​получить текущий объект, используя $(this)

Answer 2

$(function() {
    $('.slideshow').each(function(index,elem) {
        $(this).crossSlide({
            sleep: 2,
            fade: 1
        }, [
            { src: 'picture'+index+'A.jpg' },
            { src: 'picture'+index+'B.jpg' },
        ])
    });
});

Вы можете сделать имя файла источника изображения функцией текущего элемента. Вы можете выбрать имя файла на основе индекса, атрибута этого элемента или чего-то подобного.

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