Question

过去几个小时我一直在研究这个问题，这让我的小脑子感到困惑。

正在发生的事情是，jQuery动画动画似乎在动画期间停止，从而阻止回调发生。

问题是这种情况发生间歇性和随机性，以至于我无法在我的代码中找到问题。它似乎大约每7次发生一次。然而，它可能在第一次或10次之后发生。

在这种情况下，我真的不能把jsfiddle放在一起，因为它与网站的其他部分紧密相连。相反，我想在这里留下一个链接并指向相关部分。这是一个link to the site in question。下面显示的代码从第219行开始。如果您查看firebug控制台，您可以看到我在代码运行时所做的日志。您还可以看到，当问题发生时，css属性left尚未动画完成。

以下是显示该问题的图片。请注意，css left属性不是664px（如果问题没有发生，那将会是这样）。

enter image description here

以下是相关代码。

    $(".close").live("click", function() {

        console.log("--------------------");
        console.log("Close button has been clicked");

        var toMove = $(this).parent().attr("class").replace("infoBox ", "");

        $(this)
            .parent()
            .fadeOut("fast");

        console.log("Setting #" + toMove + " back to default position");

        $("#" + toMove)
            .removeClass("active")
            .addClass("ready")
            .delay(100)
            .animate({
                left: $("#" + toMove).attr("data-left").replace("px", "")
            }, 200, function() {
                console.log("Animate has finished. Now checking all images are in the right place");
                resetAll();
                $(".close").remove();
        });
    });

我的问题有什么问题吗？让我知道，我非常乐意修改+编辑，以符合stackoverflow的严格标准！

相关

Bug with .animate()'s callback?

Answer 1

尝试在图标中添加中间状态。单击关闭按钮后，该课程将从＆＃34; active＆＃34;准备好＆＃34;。添加＆＃34;移动＆＃34;例如，当其状态为＆＃34;移动时，不要调用任何其他功能。当它返回到初始位置时，您可以将类设置为＆＃34; ready＆＃34;试。

$("#" + toMove)
        .removeClass("active")
        .addClass("moving")
        .delay(100)
        .animate({
            left: $("#" + toMove).attr("data-left").replace("px", "")
        }, 200, function() {
            console.log("Animate has finished. Now checking all images are in the right place");
            resetAll();
            $(".close").remove();
    })
        .removeClass("moving")
        .addClass("ready");

Animate回调不会运行

1 个答案: