jQuery 链接未按预期运行

Question

我的理解是 jQuery 在运行的函数完成之前不会移动到下一个函数。但是，这似乎对我不起作用。例如:

                    $("#bigmap").animate(
                    {
                    opacity: 0
                    }, 500).css("display", "none");     

我希望这会淡出 #bigmap，然后将其显示设置为无。但是，它似乎立即设置为无。

我是新手，所以确定这是显而易见的事情。

Answer 1

基本上，这没有按您预期的方式工作的原因是链在序列中触发并立即触发。动画功能在一段时间内发生。

这意味着一旦动画开始，显示就不会触发。

需要使用动画结束时运行的animate方法的回调函数。

$('#bigmap').animate({
    opacity:0
}, 500, function() {
    $(this).hide();
});

如果你checkout the docs您可以找到有关回调函数的更多信息，在方法中称为 complete。