爲什麼這個全局計數器變量不適用於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？

回答

相關問題