Question

<!doctype HTML>
<html>
    <head>
        <title>timer</title>
        <script>
        function timer(button){
            var btn = document.getElementById("button1").value;
            var status;
                if(btn == "Start"){
                    button.value = "Stop";
                    status = true;
                };
                if(btn == "Stop"){
                    button.value = "Start";
                    status = false;
                    };
            var time = document.getElementById("numberinput").value;

            time = ++time;
            decrement();
            function decrement(){
                if(time > 0 && btn == "Start" && status == true){
                    time = --time;
                    document.getElementById("result").innerHTML = time;
                    var to = setTimeout(decrement, 1000);
                };
            };
        };

    </script>
</head>
<body>
<center>
    <div id="info">Enter the number of secounds</div>
        <form id="form1">
            <input type="number" id="numberinput"><br />
            <input type="button" id="button1" onclick="timer(this)" value="Start">
            <div id="result"></div>
        </form>
</center>
</body>

为什么这段代码不起作用？

这应该是倒计时的时间。

开始按钮工作正常，但停止没有。

如果有人可以向我解释为什么这不起作用，我会非常乐于助人，并给我一个如何解决这个问题的例子。

谢谢！

Answer 1

你走在正确的轨道上，但却有一些错误的一般编码习惯。

time = --time;可以写成time--;（与++相同）
我个人不会在函数（decrement()）
将值作为参数发送给其他功能
setTimeout()需要将其第一个参数作为匿名函数（有点奇怪，但需要发生）

这是您的工作代码：

window.timer = function(button){
    var btn = document.getElementById("button1").value;
    var status;
    if(btn == "Start"){
        button.value = "Stop";
        status = true;
    };
    if(btn == "Stop"){
        button.value = "Start";
        status = false;
    };
    var time = document.getElementById("numberinput").value;
    document.getElementById("result").innerHTML = time;
    decrement(time, status);
};

window.decrement = function(time, status){
    var btn = document.getElementById("button1").value;
    if(time > 0 && btn == "Stop" && status == true){
        time--;
        document.getElementById("result").innerHTML = time;
        var to = setTimeout(function() {
            decrement(time, status);
        },1000);
     };
 };

JSFiddle：https://jsfiddle.net/8fmn4src/

javascript倒计时只是一个小计时器无法正常工作

1 个答案: