Javascript 如何以延迟方式调用函数_Javascript

Javascript 如何以延迟方式调用函数

javascript

Javascript 如何以延迟方式调用函数,javascript,Javascript,我有一个文本框，每当用户键入某些内容时，我都想更新span的内容。但是，我确实希望在更新跨度之前等待一段时间。我试着使用setTimeout甚至setInterval，但它似乎不起作用这是我的html： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Sample Title</title> </head> <body> <

我有一个文本框，每当用户键入某些内容时，我都想更新span的内容。但是，我确实希望在更新跨度之前等待一段时间。我试着使用setTimeout甚至setInterval，但它似乎不起作用

这是我的html：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Sample Title</title>
</head>
<body>
<input type="text" id="text-box-1" />
<span id="results"></span>
</body>
</html>

当我输入文本框时，它开始显示在范围内，而不是等待5秒。我错过了什么

谢谢。

您需要将对更新函数的调用包装在函数内的setTimeout中

函数更新（textValue）{
document.querySelector（“#results”）.innerHTML=textValue；
}
document.querySelector（“#text-box-1”）.onkeyup=function（e）{
setInterval（函数（）{update（document.querySelector（#text-box-1”）.value）}，5000；
}

setInterval（）函数接受两个参数，一个函数和一个超时值。您给了它一条语句，该语句将立即执行，然后setInterval（）函数在5秒钟内不执行任何操作，因为它没有得到要执行的真函数

只需将语句包装在匿名函数中即可获得所需的结果。：）

希望这有帮助

我的天啊。如果我正在调用一个函数，为什么我需要将它封装在函数中？啊。这太令人困惑了。我在看W3，它有setInterval（函数，毫秒，参数1，参数2，…），其中“函数”是将要执行的函数。所以，我只是在那里使用了函数名。没有意识到我需要将它包装成“function（）{}”啊…这太不直观了。@Blueboye但你不只是“使用函数名”，你直接调用函数并将其返回值传递给

setTimeout

-在这种情况下，浏览器正在立即调用该函数，并且没有向

setTimeout

@NiettheDarkAbsol传递任何内容。我不确定是否遵循了此操作。我提供了要执行的函数“update”，并将参数添加到它所需的函数中。这就是为什么它会马上执行它？如果我需要发送参数，如何使其工作？只是将其包装在函数（）中{}？我在哪里可以阅读更多关于这在概念上是如何工作的？

setTimeout（update，5000，document.querySelector（“#text-box-1”）.value）

将执行此操作，因为它将参数传递给函数

function update(textValue){
    document.querySelector("#results").innerHTML = textValue;
}

document.querySelector("#text-box-1").onkeyup = function(e){
    setInterval(update(document.querySelector("#text-box-1").value), 5000);
}

document.querySelector("#text-box-1").onkeyup = function(e){
    setInterval(function(){update(document.querySelector("#text-box-1").value)}, 5000);
}