如何使用這個倒計時庫倒計時到開始時間，然后倒計時到停止時間？
檔案說我應該添加一個引數onExpiry來運行一個回呼函式，但無論我如何組織這些功能，它要么開始遞減計數到stopdate，即使startdate仍是在未來或停靠在00:00:00:00和做對的到期沒有startdate。
我需要它做的是倒計時，startdate完成后，倒計時stopdate
function startTimers() {
$(function() {
$('#auction-counter').countdown({
until: startdate,
onExpiry: stopTimer,
format: 'DHMS',
padZeroes: true,
alwaysExpire: true
});
function stopTimer() {
$('#auction-counter').countdown({
until: stopdate,
format: 'DHMS',
padZeroes: true,
alwaysExpire: true
});
}
});
}
上面的代碼倒計時，startdate但停在00:00:00:00
uj5u.com熱心網友回復：
您的代碼即將運行。您遇到的問題是需要從#auction-counter元素中洗掉原始倒計時實體。這可以使用destroy倒計時插件的設定來完成。
從那里您可以使用 重新初始化第二個倒計時stopdate，如下所示：
// date setup
let now = new Date();
let startdate = new Date(now.setSeconds(now.getSeconds() 5));
let stopdate = new Date(now.setSeconds(now.getSeconds() 5));
let $counter = $('#auction-counter');
function firstTimer() {
$counter.countdown({
until: startdate,
onExpiry: secondTimer,
format: 'DHMS',
padZeroes: true,
alwaysExpire: true
});
}
function secondTimer() {
$counter.countdown('destroy'); // destroy original countdown instance
console.log('starting second countdown');
$counter.countdown({
until: stopdate,
onExpiry: () => console.log('both timers complete!'),
format: 'DHMS',
padZeroes: true,
alwaysExpire: true
});
}
firstTimer();<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.1.0/js/jquery.plugin.min.js" integrity="sha512-MPI2h 3IVJR8ElOGFV02uH6W1augIqS9y/YgTZH7xNb7QwLVPjFL0eRxbDpE6ZAk/hQbHm6zWXMh/oMR4/3sDA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.1.0/js/jquery.countdown.min.js" integrity="sha512- Cdr05lT aP PTW4988XKLMjoAf0o5P2nRDIHooD/NItysfsyCPPhZhK/C6s7ZpaVoMRtsvRNJLtYOTDANC5UA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.1.0/css/jquery.countdown.min.css" integrity="sha512-3TZ6IiaoL7KEeLwJgOfw /dEOxOUpb9YhmUokvcFOvNuFJ7t9kvilMNAMqeJ8neRT4iBnCe35TZsPwD2Y1Gl6g==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<div id="auction-counter"></div>轉載請註明出處，本文鏈接：https://www.uj5u.com/net/373280.html