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的仿照flash放大图片效果代码
Mar 16 Javascript
Js表格万条数据瞬间加载实现代码
Feb 20 Javascript
js使用for循环查询数组中是否存在某个值
Aug 12 Javascript
jquery ajax请求方式与提示用户正在处理请稍等
Sep 01 Javascript
JS ES6中setTimeout函数的执行上下文示例
Apr 27 Javascript
js字符串与Unicode编码互相转换
May 17 Javascript
使用vue-cli导入Element UI组件的方法
May 16 Javascript
基于vue展开收起动画的示例代码
Jul 05 Javascript
在Create React App中启用Sass和Less的方法示例
Jan 16 Javascript
详解js创建对象的几种方法及继承
Apr 12 Javascript
jQuery 常用特效实例小结【显示与隐藏、淡入淡出、滑动、动画等】
May 19 jQuery
js实现简易计算器小功能
Nov 18 Javascript
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
在WordPress中获取数据库字段内容和添加主题设置菜单
2016/01/11 PHP
Laravel实现自定义错误输出内容的方法
2016/10/10 PHP
php中文乱码问题的终极解决方案汇总
2017/08/01 PHP
PHP操作Redis数据库常用方法示例
2018/08/25 PHP
JAVASCRIPT keycode总结
2009/02/04 Javascript
GWT中复制到剪贴板 js+flash实现复制 兼容性比较好
2010/03/07 Javascript
jquery ui 1.7 ui.tabs 动态添加与关闭(按钮关闭+双击关闭)
2010/04/01 Javascript
jQuery UI Datepicker length为空或不是对象错误的解决方法
2010/12/19 Javascript
深入浅出理解javaScript原型链
2015/05/09 Javascript
js实现简单的联动菜单效果
2015/08/19 Javascript
JS实现3D图片旋转展示效果代码
2015/09/22 Javascript
老生常谈javascript的类型转换
2016/10/12 Javascript
微信小程序上滑加载下拉刷新(onscrollLower)分批加载数据(一)
2017/05/11 Javascript
详解angularJs中关于ng-class的三种使用方式说明
2017/06/02 Javascript
详解vue.js移动端导航navigationbar的封装
2017/07/05 Javascript
Vue.directive()的用法和实例详解
2018/03/04 Javascript
关于微信小程序bug记录与解决方法
2018/08/15 Javascript
Bootstrap fileinput 上传新文件移除时触发服务器同步删除的配置
2018/10/08 Javascript
Vue 组件修改根实例的数据的方法
2019/04/02 Javascript
Bootstrap table 实现树形表格联动选中联动取消功能
2019/09/30 Javascript
0基础学习前端开发的一些建议
2020/07/14 Javascript
python字典序问题实例
2014/09/26 Python
django主动抛出403异常的方法详解
2019/01/04 Python
Django Admin设置应用程序及模型顺序方法详解
2020/04/01 Python
Python 排序最长英文单词链(列表中前一个单词末字母是下一个单词的首字母)
2020/12/14 Python
解决pytorch 数据类型报错的问题
2021/03/03 Python
CSS的background属性及CSS3的背景图片设置总结
2016/06/13 HTML / CSS
英国儿童设计师服装的领先零售商:Base
2019/03/17 全球购物
小学生新学期寄语
2014/01/19 职场文书
创业计划实施的7大步骤
2014/02/05 职场文书
教师群众路线学习心得体会
2014/11/04 职场文书
捐助感谢信
2015/01/22 职场文书
大学生思想道德自我评价
2015/03/09 职场文书
拔河比赛新闻稿
2015/07/17 职场文书
详解RedisTemplate下Redis分布式锁引发的系列问题
2021/04/27 Redis
golang定时器
2022/04/14 Golang