在执行 javascript 之前设置 5 秒延迟答案

【问题标题】：Set 5 second delay before executing javascript在执行 javascript 之前设置 5 秒延迟
【发布时间】：2019-01-30 20:18:36
【问题描述】：

我正在尝试在执行 javascript 函数之前添加 5 秒的延迟。该函数与按钮单击事件相关联。理想情况下，用户会单击该链接，然后在执行该功能之前会有 5 秒的延迟。到目前为止，这是我尝试过的：

<input onclick="myFunction()" id="link" type="Submit" value="GO" style="border-radius: 5px;"/>

function myFunction() {
  style.transitionDelay = "5s"; 
  var url = window.location.href;
  var res = url.split("#");
  var hash = "#" + res[1];
  window.location = 'test123.com/go' + hash;
};

有什么想法吗？

【问题讨论】：

setTimeout(myFunction, 5000); 是你想要的吗？
我忘了提到该函数与点击事件相关联： - 所以基本上一旦有人点击我希望在执行函数之前有 3-5 秒的延迟
编辑您的问题并包含minimal reproducible example - 请
更新了问题

标签： javascript settimeout transition

【解决方案1】：

你可以使用 JS 的setTimeout (https://www.w3schools.com/jsref/met_win_settimeout.asp)

例如：

// define the function to call
function myFunction() {
  console.log('timed out');
  alert('ding!');
};

// get a handle on the button DOM element 
var btnElement = document.getElementById('btn');

// register event on button click
btnElement.addEventListener('click', function(){
  console.log('clicked');
  // execute it in 5 secs (delay time is in milliseconds, so 5*1000=5000ms -> 5secs)
  setTimeout(myFunction, 5 * 1000);
});

&lt;button id="btn"&gt;Click Me!&lt;/button&gt;

【讨论】：

我忘了提到该函数与点击事件相关联： - 所以基本上一旦有人点击我希望在执行函数之前有 3-5 秒的延迟
我很高兴能帮上忙 :)

【解决方案2】：

Javascript 具有函数 setInterval(callback, time);，因此在下面的示例中，您可以将带有回调函数的名称和时间（以毫秒为单位）传递给 onclick 事件 setTimeout() 函数。

例子：

<input onclick="setTimeout(myFunction, 5000)" id="link" type="Submit" value="GO" style="border-radius: 5px;"/>
<script>
    function myFunction(){
        alert(1);
    }
</script>

【讨论】：

对于较新的程序员，它可以帮助他们理解代码的作用（以及查看工作代码）-我建议您在答案中添加一些 cmets，以使 OP 和其他遇到您的问题稍后再回答。
看起来这个也可以。我可以添加另一个复选标记还是只添加一个？
@Chris 每个问题只有一个答案 - 如果有多个答案，请选择最适合您的答案并为其他答案投票 :)
@Chris 你的意思是这样的吗？ <input onclick="setTimeout(myFunction, 1000); setTimeout(myFunction2, 5000)" id="link" type="Submit" value="GO" style="border-radius: 5px;"/>
@Chris 没问题。 :)