jQuery实现页面倒计时并刷新效果


Posted in Javascript onMarch 13, 2017

下面一段代码给大家分享基于jquery实现的页面倒计时并刷新效果,代码如下所示:

var intDiff = parseInt(600);//倒计时总秒数量
    function timer(intDiff){
      window.setInterval(function(){
      var day=0,
        hour=0,
        minute=0,
        second=0;//时间默认值    
      if(intDiff > 0){
        day = Math.floor(intDiff / (60 * 60 * 24));
        hour = Math.floor(intDiff / (60 * 60)) - (day * 24);
        minute = Math.floor(intDiff / 60) - (day * 24 * 60) - (hour * 60);
        second = Math.floor(intDiff) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
      }else{//当时间耗尽,刷新页面
        window.location.reload();
      }
      if (minute <= 9) minute = '0' + minute;
      if (second <= 9) second = '0' + second;
      $(".timeShow").html('本页数据还剩下<font>'+minute+'分'+second+'</font>秒刷新,刷新间隔时间: 10 分钟');
      intDiff--;
      }, 1000);
    } 
    $(function(){
      timer(intDiff);
    });
<span class="timeShow"></span>

以上所示是小编给大家介绍的jQuery实现页面倒计时并刷新效果,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
javascript 对象的定义方法
Jan 10 Javascript
IE6弹出“已终止操作”的解决办法
Nov 27 Javascript
Js从头学起(基本数据类型和引用类型的参数传递详细分析)
Feb 16 Javascript
JS短路原理的应用示例 精简代码的途径
Dec 13 Javascript
JS 获取浏览器和屏幕宽高等信息代码
Mar 31 Javascript
实例讲解JQuery中this和$(this)区别
Dec 08 Javascript
JS如何判断是否为ie浏览器的方法(包括IE10、IE11在内)
Dec 13 Javascript
原生实现一个react-redux的代码示例
Jun 08 Javascript
vue的过滤器filter实例详解
Sep 17 Javascript
trackingjs+websocket+百度人脸识别API实现人脸签到
Nov 26 Javascript
webpack.DefinePlugin与cross-env区别详解
Feb 23 Javascript
如何让vue长列表快速加载
Mar 29 Vue.js
JS实现的简单拖拽功能示例
Mar 13 #Javascript
jQuery中layer分页器的使用
Mar 13 #Javascript
如何理解jQuery中的ajaxSubmit方法
Mar 13 #Javascript
Node.js调试技术总结分享
Mar 12 #Javascript
JavaScript中双符号的运算详解
Mar 12 #Javascript
利用Node.js对文件进行重命名
Mar 12 #Javascript
纯js的右下角弹窗实例
Mar 12 #Javascript
You might like
第十四节--命名空间
2006/11/16 PHP
php 如何获取数组第一个值
2013/08/06 PHP
php版微信数据统计接口用法示例
2016/10/12 PHP
如何通过Apache在本地配置多个虚拟主机
2020/07/29 PHP
JavaScript 学习笔记(六)
2009/12/31 Javascript
javascript中this做事件参数相关问题解答
2013/03/17 Javascript
从零学jquery之如何使用回调函数
2014/05/16 Javascript
在JS数组特定索引处指定位置插入元素的技巧
2014/08/24 Javascript
jQuery Validate插件实现表单强大的验证功能
2015/12/18 Javascript
js微信支付实现代码
2016/12/22 Javascript
利用Angular.js编写公共提示模块的方法教程
2017/05/28 Javascript
jquery实现一个全局计时器(商城可用)
2017/06/30 jQuery
es7学习教程之fetch解决异步嵌套问题的方法示例
2017/07/21 Javascript
vue解决跨域路由冲突问题思路解析
2017/11/03 Javascript
解决Vue2.0中使用less给元素添加背景图片出现的问题
2018/09/03 Javascript
详解JS取出两个数组中的不同或相同元素
2019/03/20 Javascript
性能优化篇之Webpack构建速度优化的建议
2019/04/03 Javascript
Vue项目中使用better-scroll实现菜单映射功能方法
2019/09/11 Javascript
[02:19]2018年度DOTA2最佳核心位选手-完美盛典
2018/12/17 DOTA
解决谷歌搜索技术文章时打不开网页问题的python脚本
2013/02/10 Python
使用Python下载Bing图片(代码)
2013/11/07 Python
Python学习之Anaconda的使用与配置方法
2018/01/04 Python
Python利用ORM控制MongoDB(MongoEngine)的步骤全纪录
2018/09/13 Python
python 同时运行多个程序的实例
2019/01/07 Python
实例详解python函数的对象、函数嵌套、名称空间和作用域
2019/05/31 Python
Python爬取腾讯视频评论的思路详解
2019/12/19 Python
解析PyCharm Python运行权限问题
2020/01/08 Python
使用Django搭建网站实现商品分页功能
2020/05/22 Python
为什么在使用动态 SQL 语句时必须为低层数据库对象授予权限
2012/12/13 面试题
历史学专业个人的自我评价
2013/10/13 职场文书
自主招生自荐信格式
2013/12/03 职场文书
晚归检讨书
2014/02/19 职场文书
置业顾问岗位职责
2014/03/02 职场文书
大学四年个人自我小结
2014/03/05 职场文书
人生感悟经典句子
2019/08/20 职场文书
详解Vue中$props、$attrs和$listeners的使用方法
2022/02/18 Vue.js