Jquery扩展- 倒计时
Source Code
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
(function($) { $.fn.countdown = function(options) { // default options var defaults = { attrName : 'data-diff', tmpl : '<span class="hour">%{h}</span><span class="minute">%{m}</span>分钟<span class="second">%{s}</span>秒', end : 'has ended', afterEnd : null }; options = $.extend(defaults, options); // trim zero function trimZero(str) { return parseInt(str.replace(/^0/g, '')); } // convert string to time function getDiffTime(str) { var m; if ((m = /^(\d{4})[^\d]+(\d{1,2})[^\d]+(\d{1,2})\s+(\d{2})[^\d]+(\d{1,2})[^\d]+(\d{1,2})$/.exec(str))) { var year = trimZero(m[1]), month = trimZero(m[2]) - 1, day = trimZero(m[3]), hour = trimZero(m[4]), minute = trimZero(m[5]), second = trimZero(m[6]); return Math.floor((new Date(year, month, day, hour, minute, second).getTime() - new Date().getTime()) / 1000); } return parseInt(str); } // format time function format(diff) { var tmpl = options.tmpl, day, hour, minute, second; day = /%\{d\}/.test(tmpl) ? Math.floor(diff / 86400) : 0; hour = Math.floor((diff - day * 86400) / 3600); minute = Math.floor((diff - day * 86400 - hour * 3600) / 60); second = diff - day * 86400 - hour * 3600 - minute * 60; tmpl = tmpl.replace(/%\{d\}/ig, day) .replace(/%\{h\}/ig, hour) .replace(/%\{m\}/ig, minute) .replace(/%\{s\}/ig, second); return tmpl; } // main return this.each(function() { var el = this, diff = getDiffTime($(el).attr(options.attrName)); function update() { if (diff <= 0) { $(el).html(options.end); if (options.afterEnd) { options.afterEnd(); } return; } $(el).html(format(diff)); setTimeout(function() { diff--; update(); }, 1000); } update(); }); }; })(jQuery);
Demo
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<html> <head> <meta charset="utf-8" /> <title>Countdown Demo</title> <style> </style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script src="jquery.countdown.js"></script> <script> $(function() { $('.J_countdown1').countdown(); $('.J_countdown2').countdown({ tmpl : '<span>%{d}</span>天<span>%{h}</span>小时<span>%{m}</span>分<span>%{s}</span>秒' }); $('.J_countdown3').countdown({ tmpl : '<span>%{d}</span>天, <span>%{h}</span>小时, <span>%{m}</span>分, <span>%{s}</span>秒' }); }); </script> </head> <body> <div class="J_countdown1" data-diff="10"></div> <div class="J_countdown1" data-diff="70"></div> <div class="J_countdown1" data-diff="3610"></div> <div class="J_countdown1" data-diff="86410"></div> <div class="J_countdown2" data-diff="21234567890"></div> <div class="J_countdown3" data-diff="21234567890"></div> </body> </html>
http://jquerycountdown.codeplex.com/
1.职业成功的85%取决于职业心态,15%取决于职业技能
2.不只是上级要你去做或等待别人要你去做
3.营造积极友善的工作氛围,哪怕吹点善意的牛