Question

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

在此脚本中，我将crossSlide效果应用于#slideshow。但是，如果我有20个div，并且我想将crossSlide效果应用于“幻灯片”类的每个div，该怎么办？

如何遍历div，找到类.slideshow的div，并将相应的图像应用于每个？

编辑：每个div都有自己想要显示的图像。

Answer 1

将class selector与element selector结合使用。

$('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次。

我如何在JQuery中进行循环？

2 个答案: