Jquery 悬停，重复

当用户将鼠标悬停在div1上时：-

• div1和div2的内容淡出
• div1加载一些新内容
• div2在Div1的现有内容中淡出

这就是我想要停止的地方

但是，当加载div1的新内容时，将再次触发悬停事件，并继续

在初始悬停事件之后，如何使悬停事件不会再次发生，直到用户移除光标并再次悬停在div1上

希望这有意义，提前干杯

$('document').ready(function () {

    //For each small block
    $('#div1').hover(function () {

        var thisWish = $(this).html();
        var nextWish = $('#wishy1').html();

        //Fade the small block out bring in a new wish
        $(this).fadeOut(1200, function () {
            $(this).html(nextWish).fadeIn(1200, function () {

            });
        });

        //Fade the large block and and bring in the small blocks wish
        $('#div2').fadeOut(1200, function () {
            $('#div2').html(thisWish).fadeIn(1200, function () {

            });
        });
    }, 
    function () {
        // hover out
    });
});

---

由于未使用悬停的第二个事件，请改用鼠标悬停：

---

请你发布你的HTML好吗？（或其简化版本）。

$('document').ready(function(){
    //For each small block
    $('#div1').mouseover(function(){
        var thisWish = $(this).html();
        var nextWish = $('#wishy1').html();
        //Fade the small block out bring in a new wish
        $(this).fadeOut(1200, function(){
            $(this).html(nextWish).fadeIn(1200, function(){
            });
        });
        //Fade the large block and and bring in the small blocks wish
        $('#div2').fadeOut(1200, function(){
            $('#div2').html(thisWish).fadeIn(1200, function(){
            });
        });
    }

})