なぜこの "Uncaught ReferenceError：tempoは定義されていません"というエラーですか？

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; 
}