代码

Question

我是HTML的新手，我正在开发一个项目，当您按住它时需要使用按钮，它将重复相同的操作。这是我得到的代码，但是没有用。

    !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>Button</title>
</head>
<body>
    <button id = "forward" accesskey="o" onmousedown="display(1)" onmouseup="stop()">forward</button>


    <script>

    function stop(){
        console.log(" ")
    }
    function display(value){
        if (value == 1){
            console.log("left");}}
    </script>



</body>
</html>

Answer 1

您需要的是setInterval和clearInterval。

代码

var wrapper = document.getElementById('counter');
  var counter;
  var count = 0;
  
  function start() {
    counter = setInterval(function() {
      wrapper.innerHTML = count;
      count++;
    }, 500);
  }
  function end() {
    clearInterval(counter)
  }

<button onmousedown="start()" onmouseup="end()">Click and hold</button>
<p id="counter"></p>

说明

如果您不熟悉setInterval和clearInterval，则它们与setTimeout类似。您可以将setInterval分配给一个变量，稍后可以将其传递给clearInterval以停止它。这样做是将您传递的代码放入另一个堆栈中，以便您的其他代码可以继续执行，例如可以清除它的onmouseup事件。

实践

https://www.w3schools.com/jsref/met_win_setinterval.asp https://www.w3schools.com/jsref/met_win_clearinterval.asp

文档

https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearInterval

Answer 2

这取决于您的上下文（同步/异步处理）。您可以使用setInterval函数或“自调用”函数（递归）或将两者结合使用。但是，请确保在不再使用它时必须进行清除操作。否则，它将影响您的应用性能。

对于setInterval，它将异步运行，并且您的多个动作可以同时处理。因此，您需要进行处理以使数据始终保持真实。这是最重要的。

对于“自呼”功能，您可以同步处理重复动作。

更多详细信息： https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval

https://javascript.info/recursion

下面是有关使用setInterval函数的简单示例。希望有帮助。

var repeatId; // Keep ID value to we clear repeating.
var count = 0; // Count to see the number of times of repeating

function display(value){
        console.log("Start...");

    // Initialize repeating and keep ID value to use when we want to clear repeating
    repeatId = setInterval(
      // This function will be invoked after a period time
        function() {
        console.log("Holding" + (++count) + ", your value: " + value);
        }, 
      1000 // Repeat after 1 second.
    );
}

function stop(){
    clearInterval(repeatId);// Clear repeating
    count = 0;
    console.log("Stop");
}

HTML按钮-按住按钮将重复操作

2 个答案:

代码

说明

实践

文档