Question

When mouse is over a product number (focus) then show some product information.
When user is not longer over a product number (blur), then wait 3 seconds, then hide details.

$('.productNumber').live('blur', function() {               
    setTimeout(function(){
    var divToPutData = $(this); 
    divToPutData.hide();
}, 3000);
});

Now user says that if user moves mouse back within those 5 seconds to stop the count down, until a blur event fires again. No sure how to do this with setTimeout.

Answer 1

Use clearTimeout()

var myTimeout = null;

$('.productNumber').live('mouseover', function() {  
    //If timeout is still active, clear
    if(myTimeout != null)
        clearTimeout(myTimeout);
});

$('.productNumber').live('blur', function() {
    //Store the ID returned by setTimeout
    myTimout = setTimeout(function(){ divToPutData.hide(); }, 3000);
});