如何在 asp.net 内核中使用 JavaScript 创建倒数计时器？

Question

I'm tying to create a countdown timer for online test using JavaScript in asp.net core. I want it to change every 1 second without refreshing the page. when I run the program it doesn't show me the countdown.

This my javascript code:

<script type="text/javascript">
    countdown = function () {
    var current = parseInt(document.getElementById("timerLabel").innerHTML);
    document.getElementById("left").innerHTML = current;
    if (current > 0) {
        setTimeout('countdown()', 1000); // run every second
    }}

This is my view: I used foreach loop to show this.

 <div class="panel-footer">
            <p>   @item.Grade</p>
            <p>  @item.StartTime</p>
            <p id="EndTime">  @item.EndTime</p>
            <span id="timerLabel">@ViewBag.LeftTime</span>
            <p id="left"></p>
        </div>

Answer 1

1. Do not get the timerLabel value inside the function unless you also set it

2. Use interval and clear it when done

 let current = parseInt(document.getElementById("timerLabel").innerHTML); const countdown = function() { document.getElementById("left").innerHTML = --current || "Done"; // using current when 0 it is false if (current <= 0) clearTimeout(tId); // stop the interval }; const tId = setInterval(countdown, 1000)

 <span id="timerLabel">10</span> <p id="left"></p>