为什么这个全局计数器变量不适用于setTimeout？

我想通过交替每个其他字符的颜色来动画一些文本。我的代码尽可能以单向的方式工作，但setTimeout不会再次调用它来交替文本颜色。为什么这个全局计数器变量不适用于setTimeout？

这个问题似乎是我用一个全局变量作为计数器，这可能是一个我忽略的简单问题。

任何想法？这里是我的javascript代码：

var num = 0; 
function animateText(){ 
    var str = ""; 
    var title = document.getElementById("title").innerHTML; 

    for(var i = 0; i < title.length; i++){ 
     if(num % 2 == 0){ 
      if(i % 2 == 0){ 
       str += '<span style = "color: silver;">' + title.charAt(i) + '</span>'; 
      } else { 
       str += title.charAt(i) + ""; 
      } 
     } else { 
      if(i % 2 != 0) { 
       str += '<span style = "color: silver;">' + title.charAt(i) + '</span>'; 
      } else { 
       str += title.charAt(i) = ""; 
      } 
     } 
    } 

    document.getElementById("title").innerHTML = str; 
    num++; 

    if(num == 10) 
     num = 0; 

    setTimeout("animateText()", 500); 

}

来源

2012-04-09 Ian Campbell

啊，谢谢你们 - 固定错字和传球setTimeout函数引用正在工作。然而，动画会导致浏览器崩溃 - 看起来好像第一行（'var str =“”;'）在第一次迭代之后没有进行评估......相反，输出类似于+ =操作。有关于此的任何想法？ – 2012-04-09 06:08:53

除了乔纳森指出的错字，你的逻辑似乎有缺陷。第一次通过这个函数，你得到了最初的字符串，并构建了一些HTML，其中包含各种<span>标签。下一次通过函数，你从DOM元素中获得innerHTML，并再次开始处理它，就好像它只是你的字符串一样，但这次它是以前的HTML，包含所有标记 - 它不是你开始使用的字符串。您需要将原始字符串保存在未经修改的位置，以便每次通过函数时都可以只使用文本字符串，而不是每次都使用以前格式化的HTML。

来源

2012-04-09 06:01:38 jfriend00

太好了，谢谢你 - 这是一个简单的解决方案，现在它可以工作。还要感谢@JonathanLonowski的帮助。 – 2012-04-09 06:24:44

你有语法错误/错字：

str += title.charAt(i) = ""; 
//     ^

这是一个非法转让，作为一个JavaScript控制台就已经告诉你：

ReferenceError: Invalid left-hand side in assignment

但是，您还可以通过setTimeout函数引用而不是字符串：

setTimeout(animateText, 500);

这将跳过内部eval，将允许超时使用比其他领域定义的函数“全球性的。”

来源

2012-04-09 05:46:21

全局变量是蛮好

有这行代码中的语法

str += title.charAt(i) = "";

这不是一个有效的赋值

来源

2012-04-09 06:07:52

为什么这个全局计数器变量不适用于setTimeout？

回答

相关问题