如何在3秒循环内每秒更新一次实时计时器?

时间:2013-12-06 02:34:05

标签: javascript

我正在使用这样的代码     window.setInterval(函数(){     //代码在这里     },3000); 对于一个3秒的循环,我希望有一个计时器在每秒更新而不是每3秒更新,这可能吗?

我试着把它放在循环中:

var stmints = 0;
var stseconds = 0;
var stzecsec = 0;


function toAutoStop() {
  alert('Your life goes on');
}


var zecsec = 0;
var seconds = 0;
var mints = 0;

var startchron = 0;

function chronometer() {
  if(startchron == 1) {
    zecsec += 1;       // set tenths of a second


    if(zecsec > 9) {
      zecsec = 0;
      seconds += 1;
    }


    if(seconds > 59) {
      seconds = 0;
      mints += 1;
    }


   document.getElementById('showtm').innerHTML = mints+ ' : '+ seconds+ '<sub>'+ zecsec+             '</sub>';


    if(zecsec == stzecsec && seconds == stseconds && mints == stmints) toAutoStop();
    else setTimeout("chronometer()", 100);
  }
}

function startChr() { startchron = 1; chronometer(); }      // starts the chronometer
function stopChr() { startchron = 0; }                      // stops the chronometer
function resetChr() {
  zecsec = 0;  seconds = 0; mints = 0; startchron = 0;
  document.getElementById('showtm').innerHTML = mints+ ' : '+ seconds+ '<sub>'+ zecsec+     '</sub>';
}


startChr();

2 个答案:

答案 0 :(得分:1)

您可能希望将时间段设为1秒:

var UPDATE_PERIOD = 1;
var ACTION_PERIOD = 3 * UPDATE_PERIOD;

var passed = 0;
setInterval(function() {
  passed += UPDATE_PERIOD;

  updateTimer();
  if(passed % ACTION_PERIOD === 0) {
    doStuff();
  }
}, UPDATE_PERIOD * 1000);

function updateTimer() {
  document.getElementById("timer").textContent = "" + passed + "s";
}

function doStuff() {
  // do your stuff here
}

非常简单的例子:http://jsbin.com/aSAQiYud/1/edit

答案 1 :(得分:0)

http://jsfiddle.net/459Lt/

实际上这很容易。我使用了jquery但这只是为了选择元素。没有什么能真正控制逻辑。

w.clone().appendTo('body');是您想要调用需要调用的函数的地方......例如dowork() .....

var t=0, w=$('.w'),txt=$('.text');

setInterval(f,1000);
function f(){
    txt.text(t+1); 
    if(t==2) w.clone().appendTo('body');
    t=++t%3;
}