どのように私のJavaScriptのカウントダウンを停止するには？

Question

カウントダウン= 0のときにJavaScriptの機能を停止するにはどうすればよいですか？

JS：

var settimmer = 0; 
$(function(){ 
    window.setInterval(function() { 
     var timeCounter = $("b[id=show-time]").html(); 
     var updateTime = eval(timeCounter)- eval(1); 
     $("b[id=show-time]").html(updateTime); 
    }, 1000); 
}); 

HTML：

<b id="show-time">20</b> 

Answer 1

それは次のように動作します。

// Activate timer 
var iv = window.setInterval(...); 

// Deactive timer 
window.clearInterval(iv); 

また、あなたが（代わりにevalののparseInt（）を使用する必要があります）：

$(function() { 
    // Read the start value once and store it in a variable 
    var timeCounter = parseInt($("b[id=show-time]").text()); 

    // Active the counter 
    var iv = window.setInterval(function() { 
     // Decrement by one and write back into the document 
     $("b[id=show-time]").text(--timeCounter); 

     // Check if counter == 0 -> stop counting 
     if (0 == timeCounter) { 
      window.clearInterval(iv); 
      // ...do whatever else needs to be done when counter == 0 .. 
     } 
    }, 1000); 
}); 

Answer 2

例：あなたはあなたのコードのために何を望むかに基づいて

var i = 0, 
    pid = setInterval(function() { 
     if (++i > 10) 
      clearInterval(pid); 
    }, 1000); 

...

$(function() { 
    var el = document.getElementById('show-time'), 
     pid = setInterval(function() { 
      // (s - i) coerces s to Number 
      var t = el.innerHTML - 1; 
      el.innerHTML = t; 
      if (t < 1) 
       clearInterval(pid); 
     }, 1000); 
}); 

Answer 3

それは簡単です！ setIntervalに電話するとIDが返されるため、後でその期間を破棄することができます。それを破壊するには、clearInterval(id)とvoilà！を使用する必要があります。

Answer 4

を削除するこれはevalです。彼らは何もしません。

あなたがしなければならないことは、ゼロになるとタイマーをクリアすることだけです。

$(function(){ 
     var timer = setInterval(function() { 
      var timeCounter = parseInt($("b[id=show-time]").text()); 
      $("b[id=show-time]").text(--timeCounter); // remove one 
      if(!timeCounter) clearInterval(timer); 
     }, 1000); 
}); 

Answer 5

JSのタイミングは100％正確ではありません。

貼り付けコードの下やフィドルを参照してください。http://jsfiddle.net/raHrm/

<script type="text/javascript"> 
$(function(){ 

var settimmer = 0, 
    timeCounter = $("#show-time").html(), 
    updateTime = timeCounter; 

(function countDown() { 
    timeCounter = $("#show-time").html(); 
    updateTime = parseInt(timeCounter)-1; 
    $("#show-time").html(updateTime); 
    if (updateTime) { 
     setTimeout(countDown, 1000); 
    } 
})(); 

});​ 
</script> 

Answer 6

変数にタイマーが、その後で次のループを停止するclearIntervalを使用して設定します。終了を捕捉するため、簡単な条件を使用します。

$(function(){ 
    var elem=$('strong[id="show-time"]'),settimmer=0,updateTime,t; 
    t=window.setInterval(function() { 
     updateTime=parseFloat(elem.html(),10)-1; 
     if(updateTime==0) { 
      window.clearInterval(t); 
      elem.html('Done!'); 
     } else { 
      elem.html(updateTime); 
     } 
    },1000); 
}); 

を次にHTMLで：

<strong id="show-time">20</strong> 

<b>タグが償却され、それを使用しないようにしてみてください。また、要素からHTMLを取得する理由はありません。eval()単純なparseFloat()はうまく動作します。