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

Question

我正在尝试构建自己的图像幻灯片，因此代码将查看特定的 div，如果所有图像都被隐藏，它应该 fadeToggle div 中的第一个图像，然后再次重新触发该功能。我面临的问题是我检查 img:hidden 的数量是否等于该 div 内的 img.length （这是开始的 faze），如果它是真的，那么代码应该 fadeToggle 第一个图像 img:first 和它永远不应再次运行，因为下次此函数运行时 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();
    });
  }
}