MouseLeave только тогда, когда MouseEnter заканчивается

Question

с кодом наблюдения:

$('someelement').hover(
    function() { 
     console.log('mouseenter begin'); 
     setTimeout(function() { 
      console.log('mouseenter ends'); 
     }, 2000); 
    }, 
    function() { 
     console.log('mouseleave begin'); 
     setTimeout(function() { 
      console.log('mouseleave ends'); 
     }, 2000); 
    } 
) 

Если я вхожу и оставить DIV в несколько раз (или один раз меньше, чем за 2 секунды) моя консоль прибудете:

mouseenter begin 
mouseleave begin 
mouseenter ends 
mouseleave ends 

I хочу, чтобы mouseleave выполнялся только тогда, когда mouseenter заканчивается, но не знает, как это сделать.

mouseenter begin 
mouseenter ends 
mouseleave begin 
mouseleave ends 

Answer 1

Вы можете создать очередь ...

http://jsfiddle.net/FHPGS/

var queue = [] 

$('someelement').hover(
    function() { 
     queue.push('mouseenter begin'); 
     setTimeout(function() { 
      var item = queue.shift(); 
      if (item) 
       console.log(item) 
      console.log('mouseenter ends'); 
     }, 2000); 
    }, 
    function() { 
     queue.push('mouseleave begin'); 
     setTimeout(function() { 
      var item = queue.shift(); 
      if (item) 
       console.log(item) 
      console.log('mouseleave ends'); 
     }, 2000); 
    } 
)