Cancel event when delay was not met? [closed]

Closed. This question needs details or clarity. It is not currently accepting answers. 开发者_开发百科

---

Want to improve this question? Add details and clarify the problem by editing this post.

Closed 8 years ago.

Improve this question

I need to be able to cancel an event based on the amount of time an element is hovered on. Say when I set the delay to 500ms, when the element is being hovered on for less than that, an event should be cancelled, otherwise it is fired. The delay() and setTimeout() function seem incapable of doing that.

---

You can try something like this instead of using jQuery delay method.

Working demo

var timeoutId = null;
$("selector").hover(function(){
   if(timeoutId)
      clearTimeout(timeoutId);

    timeoutId = setTimeout(function(){
        alert("do your stuff here");
    }, 5000); 
}, function(){
    clearTimeout(timeoutId);
});

---

Someone might come up with something cleaner but the code below will be able to handle what you are asking. It requires 500 milliseconds to pass before the code inside the event can be triggered again. Could probably clean it up so that timer/delayMet aren't potentially global variables.

I'm using $('a').click as an example selector and event.

var timer, 
    delayMet = true;

$('a').click(function () {

  if(delayMet === true) {
    // your code here
  }
  else {
    delayMet = false;
    setTimeout(function () {
      delayMet = true;
    }, 500);
  }
});

---

You can cancel setTimeout() by doing the following.

var timer = setTimeout(function(){...},5000);
...
clearTimeout(timer);

From jQuery .delay() docs:

The .delay() method is best for delaying between queued jQuery effects. Because it is limited—it doesn't, for example, offer a way to cancel the delay—.delay() is not a replacement for JavaScript's native setTimeout function, which may be more appropriate for certain use cases.

Not sure if that is what you mean though.