Проверка актуальности события
 

Имеется страница со ссылками.
При mouseover() ajax'ом (средствами jQuery) подгружается и выводится громоздкий тултип (всплывающая подсказка).
При mouseout() - исчезает.

На практике получается, что если пользователь к моменту окончания загрузки тултипа уже увел курсор со ссылки, тултип висит и mouseout() не срабатывает.

Подскажите пожалуйста, как на момент окончания работы ajax'a проверить, актуально ли еще событие mouseover() ? Ну или, на худой конец, прервать загрузку при срабатывании mouseout(). Желательно в кодах jQuery. Или тут средствами jQuery не обойтись и придется в чистом JS обработку XMLHttpRequest расписывать ?

Может не стоит на события мыши завязывать ajax? А передать все подсказки например как данные в js.

Но если все таки надо, то просто надо засекать событие mouseout и mouseover на элементе и соответственно реагировать. Что то типа:

$('a').mouseout(function(){
    $(this).data('whereMouse', 'out');
}).mouseover(function(){
    $(this).data('whereMouse', 'over');
});

//И там где должна сформироваться подсказка:
if ($(this).data('whereMouse') == 'over') {
    // выводим подсказку
}

Хм, вариант с data() как-то даже не рассматривался.

Огромное спасибо.
Работает !

Вроде то, что мне нужно... Подскажите, как лучше организовать одну вещь...
При наведении курсора мыши, подгружается информация. Но это жутко раздражает, потому что она постоянно мешается...
Как сделать так, чтобы $.ajax выполнялся через некоторое время.
Значит вот код

$('img[uid]').live('mouseover',function () {
        uid = $(this).attr('uid');
        $.ajax({
            
            тут код аякса
 
        });
});

так так... Чуть поэкспериментировал и вроде заработало. Сделал правда чуть иначе.
Вот вид моего кода (может его можно улучшить?)

$('img[uid]').live('mouseover',function () {
        uid = $(this).attr('uid');
        whereMouse = 'over';
        $('img[uid="' + uid + '"]').live('mouseout', function(){ // с $(this) не пашет
            whereMouse = 'out';
        });

        setTimeout(function(){
            if(whereMouse == 'over') {
                $.ajax({
                            код

                });
            }
        }, 400);
});

live использую, т.к. информация постоянно подгружается

короче потестировал я свой код... Есть небольшой баг, который хотелось бы исправить. Весь вечер голову уже ломаю.........

Из-за того, что стоит таймаут, несколько событий могут запуститься одновременно. Стоит мышкой быстро провести по всем элементам и остановиться на последнем, так создается эффект мерцания на последнем. Вот чуть более полный код

$('img[uid]').live('mouseover',function () {
              
        uid = $(this).attr('uid');
        whereMouse = 'over';
        $('img[uid="' + uid + '"]').live('mouseout', function(){
            whereMouse = 'out';
        });

        setTimeout(function(){


            $('#infobar').remove(); // удаляем, если есть. На всякий пожарный

            if(whereMouse == 'over') {

                $.ajax({

                    url: local + 'ajax/json/info_u' + uid + '.json',
                    dataType: 'json',
                    success: function(json) {

                            ------------------
                            заполняем переменную infobar
                            ------------------
                            $('#track_controls').append(infobar);
                            $("#infobar").fadeIn(300);
                            
                            $('img[uid=' + uid + ']').live('mouseout',function(){
                                $("#infobar").fadeOut(300, function(){
                                    $(this).remove();
                                });
                            });
                    }
                });
            }
        }, 400);
});

подскажите, что можно сделать?

Всё. Нашёл решение ^_^ Просто очищаю таймер. Вот код

var timer;

$('img[uid]').live('mouseover',function () {
        uid = $(this).attr('uid');
        whereMouse = 'over';
        $('img[uid="' + uid + '"]').live('mouseout', function(){
            whereMouse = 'out';
        });
        if(timer) { // чистим таймер ------ это и есть решение
            clearTimeout(timer); 
            timer = null 
        }
        timer = setTimeout(function(){

            $('#infobar').remove(); // удаляем, если есть. На всякий пожарный

            if(whereMouse == 'over') {

                $.ajax({

                    url: local + 'ajax/json/info_u' + uid + '.json',
                    dataType: 'json',
                    success: function(json) {
                            
                            infobar = 'ЗАПОЛНЯЕМ';

                            //alert(infobar);
                            $('#track_controls').append(infobar);
                            $("#infobar").fadeIn(300);
                            
                            $('img[uid=' + uid + ']').live('mouseout',function(){
                                $("#infobar").fadeOut(300, function(){
                                    $(this).remove();
                                });
                            });
                    }
                });
                
            }
        }, 400);
});