Javascript setTimeout创建一个无限循环

我试图通过改变img标签的src一个接一个地随机显示不同的图像

<img src="dravid-young.jpg" width="350" height="460">
<script type="text/javascript">

var a= new Array ("dravid-childhood.jpg", "dravid-young.jpg", "Jellyfish.jpg", "Tulips.jpg" , "Lighthouse.jpg" , "Penguins.jpg");

$(document).ready(function(){
    var rand = a[Math.floor(Math.random()*a.length)];
    changeimage(a[Math.floor(Math.random()*a.length)]);
});


function changeimage(imag)
{
    $("img").attr("src",imag);
    setTimeout(changeimage(a[Math.floor(Math.random()*a.length)]), 5000);
}

</script>

---

但它似乎创建了一个无限循环，页面继续加载

当你从同一个函数中调用一个函数时，它会创建一个循环，如果你不停止它，它就是一个无限循环

传递调用函数的函数，而不是直接调用函数

setTimeout(function() {
    changeimage(a[Math.floor(Math.random()*a.length)]);
}, 5000);

您正在立即调用changeimage，它执行立即递归而不是等待

通过传递调用changeimage的函数，它将在调用它之前等待5000ms

说清楚，我只是在替换上面的错误代码。其余的应该留在原地。这是最后一个例子

function changeimage(imag) {
    $("img").attr("src",imag);

    setTimeout(function() {
        changeimage(a[Math.floor(Math.random()*a.length)]);
    }, 5000);
}

---

问题是，您在每次changeimage调用中都调用changeimage，因此您将面临一个循环

但是您在每个间隔执行一个函数，因此可以使用setInterval

比如：

---

演示：

。。。因为您每次都在SetTimeOut中调用changeimage，所以changeimage函数无条件地调用changeimage-您期望得到什么？在changeimage返回之前，您的代码实际上不会调用setTimeout—它从来不会这样做。更不用说，当只需要一次时，您试图在代码中选择3次随机图像索引。您的意思是：页面继续加载？您在做递归！实际上，它没有传递任何返回值，因为在递归之前会抛出一个超出最大调用堆栈大小的异常：-@Bergi:你说得对。我已经更新了。从概念上讲，如果允许它返回，它将返回，但递归调用永远不会返回到该点。谢谢user2736012，但我想重复显示图像，它只更改图像一次。@raju：你知道我刚刚替换了changeimage函数中的代码，对吗？我只是省略了函数changeMageImag{$img.attrsrc，imag；尽量简短。是的，user2736012，你知道了。我没有。但现在一切都好了。谢谢。你的第一行答案是对问题的最好描述。传递一个调用你的函数，而不是直接调用你的函数。再次感谢你user2736012。是的，setInterval在这种情况下更适合。added更好的示例：-感谢朋友，我似乎误解了setInterval函数的用法，感谢user2736012您的代码工作正常。但它只更改图像一次，我希望图像每5秒重复更改一次。感谢Irvin Dominin aka Edward。感谢VoronoiPotato，问题是我误解了setTimeout函数n用法。

var a = new Array("http://placehold.it/200x200", "http://placehold.it/500x500", "http://placehold.it/300x300", "http://placehold.it/400x400", "http://placehold.it/300x300", "http://placehold.it/200x200");

var intervalID = window.setInterval(changeimage, 1000);

function changeimage() {    
    $("img").prop("src", a[Math.floor(Math.random() * a.length)]);    
    console.log($("img").prop("src"))
}