實時形式倒計時用JavaScript

Question

_{請原諒我的語法/拼寫}

所以，我searching about how to make a countdown timer使用javascript，但我希望它是在<form>，因此當用戶輸入一些數字（後來成爲秒），然後點擊「開始」，計時器將啓動。但是，我堅持開發腳本。

下面是正文：

$('#detik').keyup(function() { 
 
    var sec = $(this).val(); 
 
}); 
 

 
var display = document.querySelector('#time'), 
 
    timer = new CountDownTimer(sec), 
 
    timeObj = CountDownTimer.parse(sec); 
 
format(timeObj.minutes, timeObj.seconds); 
 

 
timer.onTick(format); 
 

 
$('#timerb').click(function() { 
 
    timer.start(); 
 
}); 
 

 
function format(minutes, seconds) { 
 
    minutes = minutes < 10 ? "0" + minutes : minutes; 
 
    seconds = seconds < 10 ? "0" + seconds : seconds; 
 
    display.textContent = minutes + ':' + seconds; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdn.rawgit.com/robbmj/simple-js-countdown-timer/master/countdowntimer.js"></script> 
 

 

 
<div class="text-center"> 
 
    <h1 id="time"></h1> 
 
</div> 
 
<div class="text-center"> 
 
    <form id="formtimer" name="formtimer" class="form-inline" action="#" method="post"> 
 
    <input type="number" class="form-control" id="detik" placeholder="How many secs?"> 
 
    <button class="btn btn-default" type="submit" id="timerb">Start!</button> 
 
    </form> 
 
</div>

這有什麼錯我的腳本？爲什麼我不能顯示00:00？

Answer 1

看看這個：

$(function(){ 
 
    $('#timerb').click(function() { 
 
     var sec  = $("#detik").val(); 
 
     var timer = new CountDownTimer(sec); 
 
     var timeObj = CountDownTimer.parse(sec); 
 
     
 
     format(timeObj.minutes, timeObj.seconds); 
 
     timer.onTick(format); 
 
     timer.start(); 
 
    }); 
 

 
    function format(minutes, seconds) { 
 
     minutes = minutes < 10 ? "0" + minutes : minutes; 
 
     seconds = seconds < 10 ? "0" + seconds : seconds; 
 
     
 
     var display = document.querySelector('#time'); 
 
     display.textContent = minutes + ':' + seconds; 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdn.rawgit.com/robbmj/simple-js-countdown-timer/master/countdowntimer.js"></script> 
 

 

 
<div class="text-center"> 
 
    <h1 id="time"></h1> 
 
</div> 
 
<div class="text-center"> 
 
    <form id="formtimer" name="formtimer" class="form-inline" action="#" method="post"> 
 
    <input type="number" class="form-control" id="detik" placeholder="How many secs?"> 
 
    <button class="btn btn-default" type="button" id="timerb">Start!</button> 
 
    </form> 
 
</div>