爲什麼這個「Uncaught ReferenceError：速度未定義」錯誤？

Question

我有下面的代碼：

$("#avvia_cronometro").click(function() { 
    var tempo = setInterval(function() { 
     cronometro(); 
     $("#tempo_cronometro").html((h)+":"+(min)+":"+(sec)); 
    }, 1000); 
}); 
$("#stop_cronometro").click(function() { 
    clearInterval(tempo); 
}); 

function cronometro() { 
    if (sec == 59) { 
     min +=1; 
     if (min == 59) { 
      h+=1; 
      min=0; 
     } 
     sec=0; 
    } 
    sec+=1; 
} 

當我點擊#stop_cronometro它不工作，它說：

Uncaught ReferenceError: tempo is not defined 

我該如何解決？

如果我點擊#avvia_cronometro它開始時間，所以它的工作。

Answer 1

因爲是存在於全球範圍（或任何範圍即停單擊處理可達到）沒有變量tempo。

當你聲明一個變量var一個函數內部，當函數返回變量被刪除：

function foo() { 
    var bar = 1; 
} 
foo(); 
console.log(bar); // uncaught reference error - "bar" doesn't exist 

如果你需要一個全局變量，使用它沒有var：

function foo() { 
    bar = 1; 
} 
foo(); 
console.log(bar); // prints 1 

但是，我通常不會推薦這個，因爲它對未來的維護者來說看起來是一個錯誤。取而代之的是，在全球範圍內顯式聲明的全局變量來清楚地顯示你的意圖：

var bar = null; 
function foo() { 
    bar = 1; 
} 
foo(); 
console.log(bar); // prints 1 

Answer 2

因爲您在開始執行之前清除間隔。在if中處理速度未定義。 SetInterval是一個異步調用。

Answer 3

嗯，它發生是因爲變量作用域在單獨的函數中，當一個變量在函數內部聲明時，它將只能被自己和子函數訪問。

在你的情況我建議你「節奏」全球變化：

var tempo = null; 
$("#avvia_cronometro").click(function() { 
    tempo = setInterval(function() { 
     cronometro(); 
     $("#tempo_cronometro").html((h)+":"+(min)+":"+(sec)); 
    }, 1000); 
}); 
$("#stop_cronometro").click(function() { 
    clearInterval(tempo); 
}); 

function cronometro() { 
    if (sec == 59) { 
     min +=1; 
     if (min == 59) { 
      h+=1; 
      min=0; 
     } 
     sec=0; 
    } 
    sec+=1; 
}