выпадение мыши не выполняется при множественном запросе ajax

Question

Когда я выполняю событие mouseenter на привязном теге, всплывающая подсказка отображается, а на подсказке на мышах скрывается. Это хорошо работает.

Но когда я быстро перемещаю мышь из нескольких тегов привязки (вызывают многократный запрос ajax), то последняя всплывающая подсказка не скрывается, даже если мышь не находится на привязном теге. (В основном это всплывающая подсказка тега привязки, на котором указатель мыши последнее введенное до завершения АЯКСА запроса)

Описания того, что я сделал:

Я должен показать всплывающую подсказку на моем якоре метке на MouseEnter события.
Итак, для того, чтобы показать детали в подсказке, связанной с якорь тег (якорный тег список идентификаторов таблицы) я добавил идентификатор (tooltipWindow) внутри DIV

<div id='tooltipWindow'> </div> 

так, на MouseEnter на анкерный ярлык, отправьте запрос ajax следующим образом:

$(document).ready(function(){ 
    $(td a).live('mouseenter', function(e){ 
    $.ajax({ 
    url: controller/action, 
    data: $(this).text(), 
    dataType: script, 
    success: function(){ 
     calculate xposition ad ypostion and set the postion of tooltip 
    } 
    }); 
}); 

});

И в js.erb файл (рубин на рельсах)

$(#tooltipWindow).show(); 
$(this).html(<%= partial template which is shown in tooltip by passing locals %>); 

на MouseLeave случае я просто скрыть всплывающую подсказку и опустошить DIV.

$(td a).live('mouseleave', function(){ 
    $(#tooltipWindow).hide(); 
    $(#tooltipWindow).empty(); 
}); 

Я попытался заменить mouseleave мышью, но он не работал.

Любая помощь будет оценена по достоинству.

Answer 1

Похоже, вы используете неправильный синтаксис, чтобы получить текст якоря

data: $(this).val(), // It does not have a value property 

Замените его

data: $(this).text(), 

Чтобы избежать многочисленных запросов Ajax, когда вы двигаете мышь слишком быстро, это лучше использовать setTimeout, чтобы справляться с ситуацией и часто ее очищать и избегать нескольких запросов.

$(document).ready(function() { 
    var timer; 
    $('td a').on('mouseenter', function (e) { 
     timer = setTimeout(function() { 
      $.ajax({ 
       url: 'controller/action', 
       data: $(this).text(), 
       dataType: script, 
       success: function() { 
        calculate xposition ad ypostion and set the postion of tooltip 
       } 
      }); 
     }, 300); 
    }); 

    $('td a').on('mouseleave', function() { 
     $('#tooltipWindow').hide(); 
     $('#tooltipWindow').empty(); 
     clearTimeout(timer); 
    }); 
});