首页 > web前端 > js教程 > js倒计时简单实现方法_javascript技巧

js倒计时简单实现方法_javascript技巧

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
发布: 2016-05-16 15:25:21
原创
1677 人浏览过

本文实例讲述了js倒计时简单实现方法的代码,分享给大家供大家参考,具体如下:

function timeDown(second) {
  var month = '', day = '', hour = '', minute = '';
  if (second >= 86400 * 30) {
   month = Math.floor(second / (86400 * 30)) + '月';
   second = second % (86400 * 30);
  }
  if (second >= 86400) {
   day = Math.floor(second / 86400) + '天';
   second = second % (86400);
  }
  if (second >= 3600) {
   hour = Math.floor(second / 3600) + '小时';
   second = second % 3600;
  }
  if (second >= 60) {
   minute = Math.floor(second / 60) + '分';
   second = second % 60;
  }
  if (second > 0) {
   second = second ? second + '秒' : '';
  }
  return month + day + hour + minute + second;
 }
登录后复制

如果想显示倒计时效果,可以使用如下代码调用:

<!-- 引入jquery -->
<script>
 $(function () {
  var second = 10000;
  $('.remain_time').html(timeDown(second));
  setInterval(function () {
   second--;
   $('.remain_time').html(timeDown(second));
  }, 1000);
 })
</script>
<span class="remain_time"></span>
登录后复制

jquery插件形式:

   $.fn.timeDown = function (opt) {
    var second = opt.second;
    var tip = '已过期';
    var $this = this;
    self._timeDown = function (second) {
     var month = '', day = '', hour = '', minute = '';
     if (second >= 86400 * 30) {
      month = Math.floor(second / (86400 * 30)) + '月';
      second = second % (86400 * 30);
     }
     if (second >= 86400) {
      day = Math.floor(second / 86400) + '天';
      second = second % (86400);
     }
     if (second >= 3600) {
      hour = Math.floor(second / 3600) + '小时';
      second = second % 3600;
     }
     if (second >= 60) {
      minute = Math.floor(second / 60) + '分';
      second = second % 60;
     }
     if (second > 0) {
      second = second &#63; second + '秒' : '';
     } else {
      return tip;
     }
     return month + day + hour + minute + second;
    };
    $this.html(self._timeDown(second));
    setInterval(function () {
     second--;
     $this.html(self._timeDown(second));
    }, 1000)
   };
// 使用方式
$('.remain_time').timeDown({second:1000,tip:'已过期'})
登录后复制

希望本文所述对大家JavaScript程序设计有所帮助。

相关标签:
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
javascript - js addClass 无效
来自于 1970-01-01 08:00:00
0
0
0
php调用js并获取js的返回值问题
来自于 1970-01-01 08:00:00
0
0
0
javascript - js代码转python
来自于 1970-01-01 08:00:00
0
0
0
找不到js文件代码
来自于 1970-01-01 08:00:00
0
0
0
js高级教程
来自于 1970-01-01 08:00:00
0
0
0
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板