Question

我正在尝试构建自己的图像幻灯片，因此代码将查看特定的div，如果所有图像都被隐藏，则应该淡化div中的第一个图像然后再次重新激活该函数。我面临的问题是我检查img：hidden的数量是否等于img.length里面的div（这是开始的faze），如果它是真的那么代码应该fadeToggle第一个图像img：first and it永远不应该再次运行，因为下次此函数运行img：hidden！= imglength，因为其中一个图像是可见的。但它一直在运行。请看下面的代码。

由于

<div class="mainSlide">
<img src="img/1.jpg" style="display:none;" />
<img src="img/2.jpg" style="display:none;" />
<img src="img/3.jpg" style="display:none;" />
</div>

<script type="text/javascript">
$(document).ready(function() {

slideShow();

function slideShow() {
    $allSlides = $('div.mainSlide img').length;
    $hiddenSlides = $('div.mainSlide img:hidden').length;

    if ($hiddenSlides == $allSlides) {
        $('div.mainSlide img:first').fadeToggle('slow').delay(5000);
    }
    slideShow();
}

});
</script>

Answer 1

为什么不使用回调？

function slideShow() {
  $allSlides = $('div.mainSlide img').length;
  $hiddenSlides = $('div.mainSlide img:hidden').length;

  if ($hiddenSlides == $allSlides) {
    $('div.mainSlide img:first').fadeToggle('slow', function() {
      slideShow();
    });
  }
}

即使返回为假，IF语句也会运行

1 个答案: