mouseover/mouseout事件與阿賈克斯請求

Question

我剛剛遇到這個問題，我希望我能從這裏得到一些頂級的想法。下面是我的代碼的樣子：

$(document).on('mouseover', '#element', function(){ 
    $.ajax({ 
      // generate hover view 
    }) 
}); 

$(document).on('mouseout', '#element', function(){ 
    // remove hover view 
}); 

正確的執行順序是mouseover - 生成視圖 - 鼠標 - 隱藏視圖。

但是由於視圖部分依賴於ajax，因此在ajax調用完成之前，如果用戶懸停速度超快，則有可能會觸發mouseout事件。在這種情況下，ajax調用完成後，該視圖就會坐在DOM中而不會消失，因爲mouseout事件已經被觸發。

Answer 1

您是否嘗試使用Promise？ 這將需要進行調整，但這樣的：

$.when($.ajax("someajaxfile.txt")).then(function(data, textStatus, jqXHR) { 
    $(document).on('mouseout', '#element', function(){ 
    // remove hover view 
}); 
}); 

您可能需要解除綁定鼠標移開爲好。