Question

在for循环中，我遍历字符串数组并同时更改图片的src，但setTimeout方法未保留myfun因为这个3000毫秒，for循环只是在最后一串数组的瞬间迭代。哪里出错？

<script>
 function myfunction(){
 var arr = ["mind.jpg","images.jpg","external.jpg"];
 var image = document.getElementById("IMAGE");

 for(var i =0;i<arr.length;i++)
 {
    setTimeout(myfun,3000);      
    image.src = arr[i];

 }
 }   
 function myfun(){

 }
</script>

Answer 1

如果你想制作类似幻灯片的东西，你需要这样做：

function myfunction() {
    var arr = ["mind.jpg","images.jpg","external.jpg"];
    var image = document.getElementById("IMAGE");
    var i = 0;
    function next() {
        image.src = arr[i];
        if(++i === arr.length) {
            i = 0
        }
    }
    setInterval(next, 3000)
}

Answer 2

for (var i = 0; i < arr.length; i++) {
    myfun(i);
}

function myfun(i) {
    setTimeout(function() {
        image.src = arr[i];
    }, 3000 * i);
}

for (var i = 0; i < 5; i++) {
    myfun(i);
}

function myfun(i) {
    setTimeout(function() {
        document.write(i + '<br>');
    }, 1000 * i);
}

什么是错的，迭代通过阵列？

2 个答案: