时间戳

首页 > 解决方案 > 如何创建一个基本的 JavaScript 计时器？

javascript - 如何创建一个基本的 JavaScript 计时器？

问题描述

我要做的是用户在文本框中输入一个数字，然后浏览器会弹出一个警报，它会倒计时......秒。下面是我的代码，但似乎没有任何效果。

<!DOCTYPE html>
    <html>
        <head> 

        </head>
        <body>
            <script type="text/javascript">
                    function timer(){
                        if(document.getElementById("time").value=="")||(isNaN(document.getElementById("time").value)==true)
                            alert("Please input a number");
                        else
                        alert("Start counting down ",(parseInt(document.getElementById("time").value))/1000," seconds");
                        setTimeout("alert('Times out');",time);
                    }
                </script>

            <input type="text" id="time"/>

            <button onClick="timer();">Submit</button>
        </body>
    </html>

标签： javascripthtmlcsswebtimer

解决方案

您缺少time变量。是undefined。
另外，不要在里面评估函数setTimeout：

var EL_time = document.getElementById("time");
var EL_startTime = document.getElementById("startTime");

function end () {
  alert("Time out!");
}

function start() {

  var time = parseInt(EL_time.value); // the missing `time`
  
  // Early return
  if (!Number.isInteger(time)) return alert("Please input a number");
  
  // Everything OK
  alert(`Start counting down ${time / 1000} seconds`);
  setTimeout(end, time);
}



EL_startTime.addEventListener("click", start);
Milliseconds: <input  id="time" type="text">
<button id="startTime">Start</button>

推荐阅读