jQuery animate（）在停止（）的情况下变得疯狂

我得到了一个在SVG定时器完成后悬停时展开的框：

但现在，如果你快速地多次上下悬停，它会变得疯狂。为什么在每个

animate（）之前放置
stop（true，true）
无法修复它

JS:

HTML:

此函数用于为每个鼠标指针排队超时作业。当定时函数解析时，它将停止元素上的任何动画，但不会清除其他定时函数

$('.wrapper').bind('mouseenter', function () {
    setTimeout(function () {
        var $this = $('.wrapper');

        $this.stop(true,true).animate({
            width: '100%'
        }, 200);

        $this.find('.main').stop(true,true).animate({
            left: '150%'
        }, 200);
    }, 2000);
});

因此，要修复此问题，您需要检查是否已设置超时，并首先清除超时：

$('.wrapper').bind('mouseenter', function () {
    var timeoutHandle = $(this).data('timeout') || 0; 

    if (timeoutHandle > 0)
        clearTimeout(timeoutHandle);

    timeoutHandle = setTimeout(function () {
        var $this = $('.wrapper');

        $this.stop(true,true).animate({
            width: '100%'
        }, 200);

        $this.find('.main').stop(true,true).animate({
            left: '150%'
        }, 200);
    }, 2000);

    $(this).data('timeout', timeoutHandle);
});

这里的一切都可以用纯css来完成，应该尝试一下。虽然这是真的，但这只是一个简化的测试用例，更为复杂。就像一个咒语，祝福你，伙计！不客气；我很乐意帮忙。您可能需要花几分钟时间熟悉下划线。特别是，在这种情况下，
去盎司
功能：
.wrapper {
    height: 600px;
    width: 200px;
    overflow: hidden;
    border: 4px solid black;
    float: right;
}

$('.wrapper').bind('mouseenter', function () {
    setTimeout(function () {
        var $this = $('.wrapper');

        $this.stop(true,true).animate({
            width: '100%'
        }, 200);

        $this.find('.main').stop(true,true).animate({
            left: '150%'
        }, 200);
    }, 2000);
});

$('.wrapper').bind('mouseenter', function () {
    var timeoutHandle = $(this).data('timeout') || 0; 

    if (timeoutHandle > 0)
        clearTimeout(timeoutHandle);

    timeoutHandle = setTimeout(function () {
        var $this = $('.wrapper');

        $this.stop(true,true).animate({
            width: '100%'
        }, 200);

        $this.find('.main').stop(true,true).animate({
            left: '150%'
        }, 200);
    }, 2000);

    $(this).data('timeout', timeoutHandle);
});