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 相关文章推荐
jquery+CSS3实现淘宝移动网页菜单效果
Aug 31 Javascript
jQuery实现打开页面渐现效果示例
Jul 27 Javascript
Vue原理剖析 实现双向绑定MVVM
May 03 Javascript
webpack构建的详细流程探底
Jan 08 Javascript
jQuery实现参数自定义的文字跑马灯效果
Aug 15 jQuery
vue项目中axios请求网络接口封装的示例代码
Dec 18 Javascript
Vue入门学习笔记【基本概念、对象、过滤器、指令等】
Apr 13 Javascript
用vscode开发vue应用的方法步骤
May 06 Javascript
koa+mongoose实现简单增删改查接口的示例代码
May 13 Javascript
vant时间控件使用方法详解
Dec 24 Javascript
Vue如何清空对象
Mar 03 Vue.js
vue postcss-px2rem 自适应布局
May 15 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
关于在php.ini中添加extension=php_mysqli.dll指令的说明
2007/06/14 PHP
Javascript 验证上传图片大小[客户端]
2009/08/01 Javascript
使用ExtJS技术实现的拖动树结点
2010/08/05 Javascript
ajax中get和post的说明及使用与区别
2012/12/23 Javascript
JQuery判断checkbox是否选中及其它复选框操作方法合集
2015/06/01 Javascript
提升jQuery的性能需要做好七件事
2016/01/11 Javascript
Javascript中prototype的使用详解
2016/06/18 Javascript
深入浅出ES6新特性之函数默认参数和箭头函数
2016/08/01 Javascript
ES6模块化的import和export用法方法总结
2017/08/08 Javascript
对vue2.0中.vue文件页面跳转之.$router.push的用法详解
2018/08/24 Javascript
angular4自定义表单控件[(ngModel)]的实现
2018/11/23 Javascript
vue input实现点击按钮文字增删功能示例
2019/01/29 Javascript
JS实现的进制转换,浮点数相加,数字判断操作示例
2019/11/09 Javascript
[03:17]2014DOTA2 国际邀请赛中国区预选赛 四强专访
2014/05/23 DOTA
[01:11:15]VGJ.S vs Secret 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Python的迭代器和生成器使用实例
2015/01/14 Python
使用Pyrex来扩展和加速Python程序的教程
2015/04/13 Python
Pandas读取MySQL数据到DataFrame的方法
2018/07/25 Python
padas 生成excel 增加sheet表的实例
2018/12/11 Python
python获取url的返回信息方法
2018/12/17 Python
Python中字符串String的基本内置函数与过滤字符模块函数的基本用法
2019/05/27 Python
Python3之不使用第三方变量,实现交换两个变量的值
2019/06/26 Python
python os.fork() 循环输出方法
2019/08/08 Python
Django项目主urls导入应用中views的红线问题解决
2019/08/10 Python
解决pyCharm中 module 调用失败的问题
2020/02/12 Python
PyInstaller的安装和使用的详细步骤
2020/06/02 Python
浅谈html5 响应式布局
2014/12/24 HTML / CSS
美国班级戒指、帽子和礼服、毕业产品、年鉴:Balfour
2018/11/01 全球购物
SQL Server里面什么样的视图才能创建索引
2015/04/17 面试题
Python面试题:如何用Python来发送邮件
2016/03/15 面试题
维稳工作情况汇报
2014/10/27 职场文书
2015年店长工作总结范文
2015/04/08 职场文书
可怜妈妈观后感
2015/06/09 职场文书
2016年质量月活动总结报告
2016/04/05 职场文书
写作技巧:如何撰写商业计划书
2019/08/08 职场文书
2019年幼儿园家长接送责任书
2019/10/29 职场文书