jQuery动画触发.complete回调5次

jQuery animate triggers .complete callback 5 times

本文关键字:回调 5次 complete 动画 jQuery      更新时间:2023-09-26

看不出我的错。请帮忙弄清楚为什么动画触发器回调了好几次。

从上到下滚动文本块下面的代码。"step" of animate移动自定义滚动条…

currentText.stop().animate({
                top: "-"+textHeight+"px"}, 
                {   
                    duration: durationOfAutoScroll, 
                    step: function(currentTop) {  
                        var positionY = currentTop;
                        if (positionY < curState.maskHeight - curState.textHeight) positionY = curState.maskHeight - curState.textHeight;
                        if (positionY > 0) positionY = 0;
                        var scrollPosition = -positionY * curState.scrollHeight / (curState.textHeight - curState.maskHeight);
                        curState.scrollerTop = scrollPosition;
                        $(".news-text .scroll-bar .scroller").css("top", scrollPosition);
                    },
                    complete: function() {
                        //jQuery.dequeue(currentText);
                        currentText.attr("data-state", 0);
                        onEndScroll();
                }
            }
            ); 

这意味着你的集合(currentText)有5元素,每个元素触发一次回调,这是预期的行为。

如果这不是你想要的,你可以创建一个promise对象并使用done方法:

currentText.stop().animate({
    top: "..."
}, {
    duration: '...',
    step: function () {
      // ...
    },
}).promise().done(function () {
    // done
});