How to disable mouseover event with javascript/jquery?

Question

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 di

Answer 1

var isExecuting = false;

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

  isExecuting = false;
}

Answer 2

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);
    });
}

Answer 3

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...