Jqueryを使用する第2のタイマー

Question

私は以下のようなjquery関数を持っていて、スパンにresualtを表示しますが、このスパンをリロードすると、しばらくの間隠れて表示されます。 私はそれを隠してはいけないことを望むこれを行う方法はありますか？ タイマーとして使っていますので!!

<span id="timer"></span> 

<script> 

     var counter = 61; 
     var x = setInterval(function() { 

      counter = counter-1; 
      $('#timer').html(counter); 

     },1000); 

    </script> 

Answer 1

最初に、あなたのタイマースパンは空です。

var counter = 61; 
 
$('#timer').html(counter); // add this line 
 
var x = setInterval(function() { 
 
    counter = counter-1; 
 
    $('#timer').html(counter); 
 
},1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span id="timer"></span>

Answer 2

あなたは1秒後のhtmlを設定しているからです。 setIntervalがトリガーされる前に、スパンには何も存在しません。

これは、あなたが

var counter = 61; 
 
const timer = $("#timer"); 
 
timer.html(counter); 
 
var x = setInterval(function() { 
 
    counter = counter-1; 
 
    timer.html(counter); 
 
},1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span id="timer"></span>

https://jsfiddle.net/vatsalpande/f1kytyhz/

Answer 3

が60sec代わりの61からあなたのタイマーを起動何ができるかです。

var counter = 60; 
 
$('#timer').html(counter); 
 
var x = setInterval(function() { 
 
    counter = counter-1; 
 
    $('#timer').html(counter); 
 
},1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span id="timer"></span>

setInterval前にカウンターでごspanを初期化。

希望すると、これが役立ちます。