html计时器重置,Javascript重置倒计时

你好

我有一个javascript倒计时的问题,我写了一个脚本,并没有坏.

我需要在几分钟之后通过ajax(json)重新加载倒计时但是在加载新数据脚本后无法正常工作.

在获得新的计时时间后倾倒或不显示！

帮我请求

谢谢 ：)

var d = today();

function today(){

now = new Date().getTime();

return Math.round(now/1000);

}

function countdown(time1,id)

{

off = today() - d;

time = time1 - off;

h = Math.floor(time / 3600);

m = Math.floor(time / 60) % 60;

s = time % 60;

t = h + ":";

if(m < 10){ t += "0"; }

t += m + ":";

if (s < 10) { t += "0"; }

t += s;

//done

if(m <= 0 && s <= 0){

$("#"+id).html("00:00:00");

return;

}

$("#"+id).html(t).show();

var sto = window.setTimeout("countdown('"+time1+"','"+id+"')", 1000);

}

$(document).ready(function(){

//clearTimeout(sto);

countdown(1000, 'timer1');

countdown(1200, 'timer2');

//example (instead of json)

setTimeout(function(){

countdown(3000, 'timer1');

countdown(3200, 'timer2');

//alert('after click ok scripts is worked!');

}, 3000)

});

解决方法:

您可以通过执行window.clearTimeout(sto)来重置超时.

James Khoury建议在声明var sto后从sto中删除var关键字;在全局命名空间中.

下面我总结一下如何在javascript中做这些时间事情：

让我们从一些日期和时间操作函数开始：

// Time functions

// default unit is the millisecond

var sec = 1000;

var ms = 1;

function formatSeconds(time) {

var seconds = Math.floor(time/1000);

with (Math) {

var sec = seconds % 60;

var min = floor(seconds/60) % 60;

var hr = floor(seconds/3600);

}

return hr+':'+min+':'+sec;

}

function now() {

return (new Date()).getTime();

}

现在实际有趣的代码：

// Timeout functions

function callPeriodically(params) {

/*

* PARAMS: {callback=function, callbackInterval=int, cleanupCallback=function}

*

* WHAT THIS FUNCTION DOES:

* Calls [[callback()]] every [[callbackInterval]] milliseconds;

* (The [[callback()]] function should return false if it wishes

* to abort callbacks.)

*

* RETURN VALUE: a function which, when called, will abort the periodic callbacks.

*

* Nomatter how periodic callbacks are aborted, the [[cleanupCallback()]] function

* is always run last thing.

*/

var callback = params['callback'];

var callbackInterval = params['callbackInterval'];

var cleanupCallback = params['cleanup'];

var timeout = window.setTimeout(makeClock());

var timer = function() {

if (callback()) # stop if callback() returns false

timeout = window.setTimeout(timer, callbackInterval);

else if (cleanupCallback)

cleanupCallback();

};

var cancel = function() {

window.clearTimeout(timeout);

cleanupCallback();

}

return cancel;

}

使用上述机器进行时钟回调：

function makeClockCallback(duration, htmlId) {

// enclose endTime in a closure:

var startTime = now();

var endTime = startTime + duration;

var countdown = function() {

var timeLeft = endTime - now();

$('#'+htmlId).html(formatSeconds(timeLeft));

return timeLeft>0; # continue as long as timeLeft>0

};

return countdown;

}

现在让我们测试一下：

// Demo

function makeAndRunClock(htmlId) {

return callPeriodically({

callback = makeClockCallback(1000*sec, htmlId),

callbackInterval = 1000*ms,

cleanupCallback = function() {

alert(htmlId+' has been cancelled!');

}

);

}

var abortClock1 = makeAndRunClock(7*sec); // will naturally stop after 7sec

var abortClock2 = makeAndRunClock(10*sec); // will naturally stop after 10sec

window.setTimeout(

function() {

abortClock1(); // force clock1 to stop after 4sec

},

4*sec

);

有一些语法错误,但你去了.

标签：jquery,javascript,countdown

来源： https://codeday.me/bug/20190630/1338758.html