In my code a function execute when user mouseover on a div for first time and the function take like 30 seconds to complete, during that 30 seconds if user mouseover the same div again , the function executes again so i want to disable mouseover event for the second time. Is there any javascript or jquery code to disable the even from that div? THanks , any help will be heartly appreciated.

In my code a function execute when user mouseover on a div for first time and the function take like 30 seconds to complete, during that 30 seconds if user mouseover the same div again , the function executes again so i want to disable mouseover event for the second time. Is there any javascript or jquery code to disable the even from that div? THanks , any help will be heartly appreciated.

• javascript
• jquery
• events

• is that 30 second function asynchronous? – Alnitak Commented Jul 2, 2012 at 14:03
• Wow, how did 3 people answer this without seeing any code – Esailija Commented Jul 2, 2012 at 14:07
• @Esailija nah, it's reasonable to provide an educated guess to the question if you know what you're doing. Unfortunately only two of the four appear to know what he's doing... – Alnitak Commented Jul 2, 2012 at 14:12

3 Answers 3

Use jQuery's on() and off() with some sort of callback, for example :

$("#myElementID").on('mouseover', myFunction);

myFunction(e) {
    var myElement = e.target;
    myElement.off('mouseover', myFunction);
    //do something that takes 30 seconds
    myElement.animate({top: 1000}, 30000, function() { //callback
        myElement.on('mouseover', myFunction);
    });
}

You can have a look at an interesting feature of jquery ... .one() here is the link for it

Description: Attach a handler to an event for the elements. The handler is executed at most once per element.

2nd idea

I can give you one more idea, suppose when the mouse over is occurred once, just unbind the mouseover event before starting your operations, then as soon as the operations are over, bind them back again...

var isExecuting = false;

function yourThirtySecFunction() {
  if (isExecuting == true) return;
  isExecuting = true;
  //do your stuff here

  isExecuting = false;
}