为什么无论时间如何,计时器都会产生相同的整数?

问题描述 投票:0回答:1

我正在编写一个简单的网络应用程序,其中会生成一个随机时间间隔,然后当用户猜测已经过去了很多时间时单击按钮,然后应用程序会显示误差范围。由于某种原因,它根本不计算经过的时间,它只是每次都向用户显示正确的时间。我认为这是一个逻辑流程或数学问题。

我尝试使用Microsoft AI copilot来调试逻辑,它没有正确理解逻辑。

下面是我的代码;


<html>
    <head> 
        <style>
            button {
               background-color:maroon;
               border-radius: 25px;
               border: none;
               padding: 20px;
               color: white;
               text-align: center;
               font-size: 50px;
            }
            body {
                font-size: 50px;
            }
        </style>       
        <script type="text/javascript">
           function guessElapsed() {                
            var limitinmiliseconds = 300; // 5 hours;
            console.log("start");
            var previoustime = localStorage.getItem("previoustime");
            const nowseconds = Math.floor(Date.now() / 1000);
            var nowminutes = nowseconds / 60 ;
            var nowhours = nowminutes / 60 ;   
            var duration = nowhours;
            var aim = localStorage.getItem("aim");                             
                if (previoustime && aim) {
                    var elapsed = duration - previoustime ;
                    var marginoferrorminutes = aim - elapsed;
                    var marginoferrorminutes = Number(marginoferrorminutes).toFixed(0); 
                    var variancediv = document.getElementById("variance");
                    console.log("if");
                    variancediv.innerHTML = "Your margin of error is: " + marginoferrorminutes + " minutes.";                  
                    localStorage.removeItem("previoustime", nowhours);
                    var aim = Math.floor(Math.random() * limitinmiliseconds);
                    const nowseconds = Math.floor(Date.now() / 1000) ;
                    var nowminutes = nowseconds / 60 ;
                    var nowhours = nowminutes / 60 ;                    
                    localStorage.setItem("previoustime", nowhours);
                    localStorage.setItem("aim", aim);
                    var truncaim = Number(aim).toFixed(0); 
                    var buttontext = document.getElementById("button");
                    buttontext.innerHTML=" I think " + truncaim + " minutes have passed.";
                    
                }
                else {                    
                   var aim = Math.floor(Math.random() * limitinmiliseconds);
                   const nowseconds = Math.floor(Date.now() / 1000) ;
                   var nowminutes = nowseconds / 60 ;
                   var nowhours = nowminutes / 60 ;                    
                   localStorage.setItem("previoustime", nowhours);
                   localStorage.setItem("aim", aim);
                   var buttontext = document.getElementById("button");
                   console.log("else");
                   var truncaim = Number(aim).toFixed(0); 
                   buttontext.innerHTML=" I think " + truncaim + " minutes have passed.";
                    }               
            }
        </script>
        </head>
        <body>
        <div id="variance"></div>
        <button id="button" onclick="guessElapsed()">Start</button>
        <script type="text/javascript">
            var aim = localStorage.getItem("aim");
            var previoustime = localStorage.getItem("previoustime");
            if (aim) {
                var buttontext = document.getElementById("button");
                var truncaim = Number(aim).toFixed(0); 
                buttontext.innerHTML=" I think " + truncaim + " minutes have passed.";
            }
        </script>
    </body>
</html>


我尝试更改整数的格式,保留小数点后的部分打开或关闭。我预计误差幅度与目标猜测不同,但尽管经过的时间不同,但每次都是匹配的。

javascript math time floor-division
1个回答
0
投票

我建议您使用调试器单步调试代码。 您会注意到,当您计算

marginoferrorminutes
时,
aim
elapsed
的值有多么不同。

所以你的

aim
设置是问题之一。

这是一个重写版本,可生成 1 到 100 秒之间的猜测间隔:

<!DOCTYPE html>
<html>
<head>
    <style>
        #myButton {
            padding: 10px 20px;
            font-size: 20px;
        }
    </style>
</head>
<body>
    <button id="myButton">Click me</button>
    <p id="timeDifference"></p>

    <script>
        const myButton = document.getElementById('myButton');
        const timeDifference = document.getElementById('timeDifference');
        let startTime;
        let randomTime;

        myButton.addEventListener('click', function() {
            let currentTime = new Date();
            if (startTime) {
                let elapsedTime = (currentTime - startTime) / 1000;
                // using abs() to get the absolute value because the order of the subtraction matters (e.g. 5 - 3 = 2 and 3 - 5 = -2)
                // and we always want to display a positive number
                let marginOfError = Math.abs(elapsedTime - randomTime);
                timeDifference.textContent = "Margin of error: " + marginOfError.toFixed(0) + " seconds";
            }
            // generate a random time between 1 and 100 seconds
            randomTime = Math.floor(Math.random() * 100) + 1;
            myButton.textContent = "I guess " + randomTime + " seconds have passed";
            startTime = new Date();
        });
    </script>
</body>
</html>
© www.soinside.com 2019 - 2024. All rights reserved.