diff --git a/docs/util/detail/demo.md b/docs/util/detail/demo.md index 24e20589..f23f2c3c 100644 --- a/docs/util/detail/demo.md +++ b/docs/util/detail/demo.md @@ -1,4 +1,4 @@ -
+ 倒计时 @@ -51,26 +51,29 @@ layui.use(function(){ var $ = layui.$; // 倒计时 - var thisTimer; - var setCountdown = function(value){ - var endTime = new Date(value); // 结束日期 - var serverTime = new Date(); // 假设为当前服务器时间,这里采用的是本地时间,实际使用一般是取服务端的 - - clearTimeout(thisTimer); - util.countdown(endTime, serverTime, function(date, serverTime, timer){ - var str = date[0] + ' 天 ' + date[1] + ' 时 ' + date[2] + ' 分 ' + date[3] + ' 秒'; + var countdown = util.countdown({ + date: '2099-12-31 00:00:00', // 目标时间值 + now: new Date(), // 当前时间,一般为服务器时间,此处以本地时间为例 + ready: function(){ // 初始操作 + clearTimeout(util.countdown.timer); // 清除旧定时器,防止多次渲染时重复执行。实际使用时不常用 + }, + clock: function(obj, inst){ // 计时中 + var str = [obj.d,'天',obj.h,'时',obj.m,'分',obj.s,'秒'].join(' '); lay('#test2').html('距离上述日期还有:'+ str); - thisTimer = timer; - }); - }; - - setCountdown('2099-12-31 00:00:00'); - + util.countdown.timer = inst.timer; // 记录当前定时器,以便在重复渲染时清除。实际使用时不常用 + }, + done: function(obj, inst){ // 计时完成 + layer.msg('Time is up'); + } + }); + // 重置倒计时 laydate.render({ elem: '#test1', type: 'datetime', - done: function(value, date){ - setCountdown(value); + done: function(value){ + countdown.reload({ + date: value + }); } });
倒计时 @@ -51,26 +51,29 @@ layui.use(function(){ var $ = layui.$; // 倒计时 - var thisTimer; - var setCountdown = function(value){ - var endTime = new Date(value); // 结束日期 - var serverTime = new Date(); // 假设为当前服务器时间,这里采用的是本地时间,实际使用一般是取服务端的 - - clearTimeout(thisTimer); - util.countdown(endTime, serverTime, function(date, serverTime, timer){ - var str = date[0] + ' 天 ' + date[1] + ' 时 ' + date[2] + ' 分 ' + date[3] + ' 秒'; + var countdown = util.countdown({ + date: '2099-12-31 00:00:00', // 目标时间值 + now: new Date(), // 当前时间,一般为服务器时间,此处以本地时间为例 + ready: function(){ // 初始操作 + clearTimeout(util.countdown.timer); // 清除旧定时器,防止多次渲染时重复执行。实际使用时不常用 + }, + clock: function(obj, inst){ // 计时中 + var str = [obj.d,'天',obj.h,'时',obj.m,'分',obj.s,'秒'].join(' '); lay('#test2').html('距离上述日期还有:'+ str); - thisTimer = timer; - }); - }; - - setCountdown('2099-12-31 00:00:00'); - + util.countdown.timer = inst.timer; // 记录当前定时器,以便在重复渲染时清除。实际使用时不常用 + }, + done: function(obj, inst){ // 计时完成 + layer.msg('Time is up'); + } + }); + // 重置倒计时 laydate.render({ elem: '#test1', type: 'datetime', - done: function(value, date){ - setCountdown(value); + done: function(value){ + countdown.reload({ + date: value + }); } });