递归函数未定义错误

Question

嗨，我有一个递归问题。

我跟着这个例子从wc3 http://www.w3schools.com/jsref/met_win_settimeout.asp 但我的似乎根本不工作。

function rotateImages(start) 
    { 
    var a = new Array("image1.jpg","image2.jpg","image3.jpg", "image4.jpg"); 
    var c = new Array("url1", "url2", "url3", "url4"); 
    var b = document.getElementById('rotating1'); 
    var d = document.getElementById('imageurl'); 
    if(start>=a.length) 
     start=0; 
    b.src = a[start]; 
    d.href = c[start]; 
    window.setTimeout("rotateImages(" + (start+1) + ")",3000); 
    } 

    rotateImages(0); 

萤火引发错误：

rotateImages is not defined 
[Break On This Error] window.setTimeout('rotateImages('+(start+1)+')',3000); 

但是，如果我改变超时：

window.setTimeout(rotateImages(start+1),3000); 

它recursives但不知何故迟迟不工作，给了我太多的递归（7000秒）

Answer 1

请注意W3School的代码。

其他答案给出了一个解决方案。我只是补充说，每次调用rotateImages函数时，都会重新创建阵列并重复DOM选择。这是不必要的。

你可以改变你的代码是这样的：

(function() { 
    var a = ["image1.jpg","image2.jpg","image3.jpg", "image4.jpg"]; 
    var c = ["url1", "url2", "url3", "url4"]; 
    var b = document.getElementById('rotating1'); 
    var d = document.getElementById('imageurl'); 

    function rotateImages(start) { 
     b.src = a[start]; 
     d.href = c[start]; 
     window.setTimeout(function() { 
      rotateImages(++start % a.length); 
     }, 3000); 
    } 

    rotateImages(0); 
})(); 

Answer 2

试试这个语法：

window.setTimeout(function() { 
    rotateImages(start+1); 
},3000); 

setTimeout()需要函数引用作为第1个参数。简单地把函数调用放在那里会给te函数的返回值作为参数，这就是延迟不起作用的原因。然而，你首先尝试评估一个字符串是一个好方法，但不推荐。

Answer 3

为什么要避免eval有很多原因，它打破范围就是其中之一。将一个字符串传递给setTimeout会在定时器耗尽时导致该值为eval。

您应该改为传递一个函数。

window.setTimeout(rotateImages(start+1),3000); 

这立即调用rotateImages，然后将它的返回值setTimeout。这没有帮助，因为rotateImages没有返回函数。

你可能想：

window.setTimeout(rotateImages,3000,[start+1]); 

，或者创建环绕开始封闭匿名函数和传递，而不是：

window.setTimeout(function() { rotateImages(start + 1); },3000); 

后一种选择具有浏览器之间提供更好的支持。