Question

我不知道为什么。我检查了一切，但它应该工作。这个shuld是一个webseit的幻灯片

<script src="JS/javascript.js">
    "use strict";
    var image = ['"bilder/1.png"','"bilder/2.png"'];
    var i = 0;

    aengereHintergrund();

    function aengereHintergrund() {
      document.getElementById('hintergund').style.backgroundImage = 'url('+image[i]+')';
      if(i < image.length){
      i ++

      }
      else {
        i = 0
      }
     setTimeout(aengereHintergrund(),3000);
    }
   </script>

Answer 1

哦，经典函数引用vs调用问题。

这是你写的：

setTimeout(aengereHintergrund(),3000);

这就是你应该写的：

setTimeout(aengereHintergrund,3000);

在第二种情况下，我们将函数aengereHintergrund本身传递给setTimeout，这正是我们想要的。在第一种情况下，您正在调用 aengereHintergrund，并将其结果（无所谓，undefined）传递给{{1} }。

（注意：你也应该使用setTimeout而不是setInterval，所以你不必一次又一次地调用它。另外，不要在setTimeout上分支你可以使用i >= image.length）。

Answer 2

如果您写if (i < images.length) i++;，i将会images.length。您可以使用i++; if (i >= images.length) i = 0;或i = (i + 1) % images.length;修正此错误：

var slides = document.getElementById("slides");
var images = ["v67W6.jpg", "USehe.jpg"];
var path = "https://i.stack.imgur.com/";
var i = 0;

nextSlide();

function nextSlide () {
  var bg = "url(" + path + images[i] + ")";
  slides.style.backgroundImage = bg;
  i = (i + 1) % images.length;
  setTimeout(nextSlide, 1000);
};

<img id="slides" width="300" height="100" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7">

我的javascript slidshow代码不起作用

2 个答案: