javascript - 如何在事件執行完畢後立刻停止事件

Question

我有一個滑鼠移入移出顯示隱藏的事件，但是滑鼠如果多次滑過就會執行多次，如何在滑鼠移出事件執行完畢後立刻停止事件？

$(".target").on('mouseenter',function() {
    $(this).children('.p1').show(function(){
        $(this).addClass('animated fadeInLeft');
        $(this).removeClass('animated fadeInLeft');
    })
});
$(".target").on('mouseleave',function() {
    $(this).children('.p1').hide(function(){
        $(this).addClass('animated fadeOutLeft');
        $(this).removeClass('animated fadeOutLeft');
    })
});

Answer 1

題主如果要用只執行一次的方法，用.one()就行，但是一般jQuery的動畫特效一定要考慮動畫隊列的問題，建議在執行動畫之前加上.stop()方法來停止「進入動畫隊列但是未完全執行完」的動畫

Answer 2

雷雷

Answer 3

on後邊加個e，你用.one()這個API它就是執行一次自動刪除了。

參考

Answer 4

你是想說馬上中止動畫吧，用 stop()

$(this).children('.p1').stop(true, true)

Answer 5

$(".target").off('mouseenter').on('mouseenter',function() {

雷雷

});
$(".target").off('mouseenter').on('mouseleave',function() {

雷雷

});