jquery实现倒计时功能

2019-11-20 10:54:18

字体：大中小

来源：转载

供稿：网友

本文实例为大家分享了jquery倒计时功能的实现代码，供大家参考，具体内容如下

定义和用法：

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。

setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
下面举例

<html> <head>  <meta charset="utf-8">  <title>jquery简单倒计时</title>  </style>  <script type="text/javascript" src="js/jquery.min.js"></script>  <script type="text/javascript">    var intDiff = parseInt(60);//倒计时总秒数量    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);     }     if (minute <= 9)      minute = '0' + minute;     if (second <= 9)      second = '0' + second;     $('#day_show').html(day + "天");     $('#hour_show').html('<s id="h"></s>' + hour + '时');     $('#minute_show').html('<s></s>' + minute + '分');     $('#second_show').html('<s></s>' + second + '秒');     intDiff--;    }, 1000);   }    $(function() {    timer(intDiff);   });  </script> </head> <body>  <h1>网页上的倒计时</h1>  <div class="time-item">   <span id="day_show">0天</span>   <strong id="hour_show">0时</strong>   <strong id="minute_show">0分</strong>   <strong id="second_show">0秒</strong>  </div>  <!--倒计时模块--> </body></html>

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

上一篇：浅析AngularJS Filter用法

下一篇：基于jquery实现瀑布流布局