你好

我有一个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

html计时器重置,Javascript重置倒计时相关推荐

  1. C语言电子闹钟(显示时间、计时器、闹钟、倒计时、世界时钟)C语言大作业

    #include <stdio.h> #include <time.h> //时间函数 #include <conio.h> //字符模式函数 #include & ...

  2. 使用 javaScript 编写倒计时小程序,到时提交表单

    使用 javaScript 编写倒计时小程序,到时提交表单 <script type="text/javascript">var countdown = 10; // ...

  3. 重置已清账项目及两种不同重置方式(只重置、重置并冲销)介绍和实操-FBRA

    文章目录 一.重置已清账项目介绍 1.1 重置方式:只重置 1.2 重置方式:重置并冲销 二.业务实操 2.1 验证是否可以直接冲销-FB08 2.2 重置方式:只重置 2.3 重置方式:重置并冲销 ...

  4. html广告倒计时代码,javascript实现倒计时关闭广告

    用Javascript实现倒计时关闭广告案例 正在学习大前端中,有代码和思路不规范不正确的地方往多多包涵,感谢指教 在很多app与网页中,我们可以看到这样的广告:进入某个网站后,会弹出一个广告,然后广 ...

  5. 利用JavaScript实现倒计时

    利用JavaScript实现倒计时 利用JS中的Date对象即可实现,创建目标时间和当前时间,利用getTime函数将两个时间转换成距离1970-01-01的秒数,相减后转化为年月日即可 利用JS中的 ...

  6. JavaScript 实现倒计时代码

    以下是使用 JavaScript 实现页面动态倒计时的代码: 1. 定义一个 CountDown()  函数计算 天.时.分.秒: 2. 使用 setInterval 对 CountDown() 函数 ...

  7. Javascript实现倒计时(计时器)

    用js 实现倒计时功能,详细代码,及讲解如下 HTML代码: <!DOCTYPE html> <html lang="en"> <head>&l ...

  8. javascript重置(base层)(。。。。不完整)

    1.nextSibling浏览器兼容问题 <ul><li id="item1"></li><li id="item2" ...

  9. js点击重置按钮重置表单

    <html> <head> <script type="text/javascript"> function formReset() { doc ...

最新文章

  1. C++中extern C的使用
  2. 【PHPExcel】生成Excel文件
  3. pythonos模块介绍_Python os模块介绍
  4. 关于 Group 的另一个函数
  5. vscode php debug
  6. java ftp 大文件_用Java实现FTP批量大文件上传下载(二)
  7. phpmyadmin在nginx环境下配置错误
  8. [LeetCode] Plus One 加一运算
  9. 如何使用内联onclick属性停止事件传播?
  10. H3C交换机创建ssh用户登录和设置aux密码
  11. Hadoop集群的搭建(结束)——修改hadoop配置文件以及启动集群服务
  12. maya为什么不能导出fbx_maya从 Maya 导出为 FBX 文件,MAYA
  13. (Demo3D 学习笔记)案例2:飞板传输货物,并按指定货位上架
  14. SAP 中英文转换-英转中
  15. CAD命令输入、结束、重复、撤销
  16. JQuery仿百度有啊人气排行特效演示
  17. 显卡内存和计算机内存,显存和内存的关系和区别
  18. 互联网公司发送短信为什么通过第三方短信平台,而不是通过运营商。
  19. webApp开发-等额本息试算
  20. 杨振宁追求的物理美学,居然在这里实现,物理学史上颜值最高的组合,看完后跪了……

热门文章

  1. MarkDown简单语法入门
  2. docker-compose使用
  3. centos - 查看程序运行状态、后台运行程序、回调后台程序、监控(tomcat和java程序为例)
  4. 一个基于Flask框架做的仿QQ邮箱系统(收发邮件、贝叶斯模型训练、垃圾邮件过滤、个性化标签)
  5. 审美能力很差能学习UI设计吗?
  6. gdb 调试core文件
  7. 华为云服务器是什么操作系统,云服务器操作系统是什么系统
  8. [unity3d][通过代码]改变材质球颜色,动态改变材质球颜色,动态改变模型颜色
  9. unity水上小船晃动物理效果
  10. mysql-slave(主从)