Question

我有一个在点击（或taphold）上执行的功能，因为我正在使用Cordova。

问题是一个函数调用Parse.com中的下一个对象来显示它的细节，但由于某种原因，它执行该函数两次甚至3次，跳过必须显示的1或2个对象。 / p>

我想防止这种情况发生，所以我已经使用了一个标志（boolean）来指示它是否通过将其设置为true来执行。如果该标志为false，则可以执行该标志并将该标志设置为true。另一个问题是，当我再次调用该函数时，布尔值仍然设置为true，并且函数将不会被执行。

因此我无法在方法内将标志初始化为false，因为它将始终执行。全局变量将在第一次设置为真，并保持其余部分的生命＆＃34;。

我通过使用计数器尝试了第二种方法，并确保如果计数器到达，让我们说0，它可以被执行，但是当它到达时我有同样的问题将它设置回0结束..让我们说函数执行了两次，我可以检查计数器是否达到2（通过每次递增）并将其设置回0.然后当下次执行时，执行3时间，所以当检查发生时，如果计数器达到2 ..它将被设置回0并且下一次执行（第3次）将再次执行，因为计数器再次为0。

如何识别或阻止这种情况发生？

我做了一个基本的Javascript来告诉你我的意思：

window.addEventListener("load",setup,false);
var counter = 0;
function setup() {
   for(var i = 0; i < 3; i++) {
       showAlert();
   }
}

function showAlert() {
   if(counter == 0) {
       alert("Executed once");
       counter++;
   } else if(counter > 2) //counter is bigger than 2, so it got executed more than once {
       counter = 0; //reset the counter to 0
   }          
}

目标是防止函数执行多次（在这种情况下，警报可能不会多次显示）。它可以执行两次甚至三次，甚至更多次。我该如何防止这种情况？

谢谢！我对编程知之甚少，但这是我迄今为止从未遇到过的事情，所以我不知道如何抓住这个并确保它被执行一次？

Answer 1

您正在经历“反弹”，这是由于短暂连续多次注册多次影响而导致的问题。要绕过它，你需要在你的函数上加一个很短的超时。（20ms左右）您可以使用第三方库，例如LoDash，它具有许多有用的实用功能，例如执行此操作的_.debounce，或者您可以自己执行此操作：

var lastClick = 0;
var delay = 20;

function doClick() {
  if (lastClick >= (Date.now() - delay))
    return;
  lastClick = Date.now();

  // do things
  alert("Hello!");
}

<button onclick="doClick()">Push me</button>

Answer 2

这是我经常使用的类似代码。

const delay = 500; // anti-rebound for 500ms
let lastExecution = 0;

function myFunction(){
    if ((lastExecution + delay) < Date.now()){
       // execute my lines
       lastExecution = Date.now() 
    }
}

Javascript - 防止函数多次执行

2 个答案: