使用jQuery在ul上懸停顯示div，但它被卡在hide上？

Question

所以基本上我試圖爲我的網站導航創建一個水平ul。當您將鼠標懸停在每個鏈接下方時，我想要一個div出現跳動。動畫在懸停時正常​​工作，但在鼠標懸停時div不會總是消失。我是jQuery的新手，所以我不確定我做錯了什麼。非常感謝任何幫助！

//append a div with class blue-hover to all li elements in main-nav 
    $('#main-nav li a').append('<div class="blue-hover"><\/div>'); 

    $('#main-nav li a').hover(

    //Mouseover, show the hidden blue-hover class with a bounce on hover 
    function() { 

     $(this).children('div').stop(true, true).show().effect("bounce", 
     {times:1}, 300); 

    }, 

    //Mouseout, fadeOut the hover class 
    function() { 

     $(this).children('div').stop(true, true).fadeTo(0,300); 

    }); 

Answer 1

不要用「這個」，當子元素可以參與，如果你通過拖動出過格，然後在某些情況下「本」可能是DIV，而不是一個離開的一個元素。

將eventObject參數的currentTarget用於懸停離開處理程序以查找給定事件冒泡的當前目標。

即

function(ev) { 
     $(ev.currentTarget).children('div').stop(true, true).fadeTo(0,300); 
    })