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 
}); 
}); 

您可能需要解除绑定鼠标移开为好。