gpt4 book ai didi

javascript - SetInterval 不重复 [循环结束时控制转移到 Chrome 调试器中的未定义窗口]

转载 作者:行者123 更新时间:2023-12-02 23:07:25 25 4
gpt4 key购买 nike

下面的 HTML/JS(vanilla) 脚本显示新随机添加问题 5000 毫秒,然后显示接下来 3000 毫秒的答案。
之后,setInterval 主循环(8000ms = 5000ms + 3000ms)应该启动并显示一个新问题,整个过程应该重复。
但是,在第一个循环之后,主循环不会重复。控件将转移到 Chrome 调试器中的 UNDEFINED WINDOW。
在 setInterval mainLoop 中,我还尝试使用实际整数值(8000ms)而不是 var time 但循环从未发生。
而且,控制台不会给出任何错误
请让我知道如何让这个脚本循环。

document.getElementById("runJS1").onclick = () => {
document.getElementById("runJS1").innerHTML = "RUNNING";
};
document.getElementById("runJS1").onclick = JS1();

function JS1() {

// <----------------------DECLARATION-------------------------->
let time = 8000; //<-- (ms)Time per loop

function log(x) {
console.log(x);
};

function consoleClear() {
console.log('\033[2J');
};



//<------------------------- SCRIPT------------------------------>

//Create a random number
function randNum() {
let a1 = Math.floor(Math.random() * 100);

return a1;
}


// Display question in (time = 5000ms) and then the answer (time =3000ms)
function add(randN) {
let a = randN();
let b = randN();
let c = randN();
let sol = a + b + c;
log(a + ' + ' + b + ' + ' + c + ' = ');

const timeLoop = 1000; //<-- loop every one second
let loop = (time / 1000) - 3; //<---loop count (1 loop/second)
const loopInterval = setInterval(function() {

document.getElementById("num").innerHTML = a + ' + ' + b + ' + ' + c + ' = ';
log(loop);
loop -= 1;
if (loop <= 0) {
clearInterval(loopInterval);
document.getElementById("num").innerHTML = a + ' + ' + b + ' + ' + c + ' = ' + sol;
return false; // <--- Control shifts to a New Undefined Window in the Chrome debugger instead of going back to setinterval loopMain(also tried without using return statement but getting the same result ).
}
}, timeLoop);

}

// Loop call to display a NEW question and then the answer in every 8000ms
var loopMain = setInterval(add(randNum), time); // <-- Loops only 1 time (even when 8000ms used instead of var time getting the same result) and never gets the control back from the setInterval loopInterval


log("Total Time = " + time / 1000 + " s");


} //<-- End JS1
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>TestObjects1</title>
<script src="testJS_objects1.js" defer></script>

</head>

<body>
<button id="runJS1">START</button>
<h3 id="num"></h3>
</body>

</html>

最佳答案

问题的根源在于在页面末尾调用 setInterval

通过这样做,如下例所示,您可以使用 randNum 参数立即调用 add 函数。这会导致每 8 秒触发一次 add 函数,且不给出任何参数。

var loopMain = setInterval(add(randNum), time);

要将参数传递给 setTimeoutsetInterval,请使用这些函数的第三个参数。

var loopMain = setInterval(add, time, randNum);

现在,每时间都会调用add函数,并将randNum参数传递给add函数。

Here on MDN更多示例说明了其工作原理。

关于javascript - SetInterval 不重复 [循环结束时控制转移到 Chrome 调试器中的未定义窗口],我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57523428/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com