javascript - jQuery 动画设置回调抛出错误

Question

我想实现一个jQuery动画回调方法progress或者step，

但无论哪种情况，我都会收到以下错误:

NS_ERROR_IN_PROGRESS: Component returned failure code: 0x804b000f (NS_ERROR_IN_PROGRESS) [nsICacheEntry.dataSize]

我搜索了很多但无法在上下文中找到任何内容，我有点卡在这里，请提出可能导致此错误的原因？

在 fiddle 中，我尝试了 step 和 progress 及其在那里的工作，但无法在我的代码中工作，我只是在看，有人在 jquery 动画中遇到过这种错误吗？

示例代码为:

    this.taskHandle.find('img').stop(true, true).animate({
        //todo//
        top: vtop, // this.taskHandle.outerHeight(),
        //'top': 0 - $('.target.upper').height(),
        width: 0,
        opacity: 0
    }, {
        duration: 2000,
        step: function(){
            console.log('I am called');
        }
    },

    $.proxy(function() {
        // some css clearing method
    }, {
        // some further actions after animation completes
    })
);

Answer 1

这里出现了一些语义错误。我将重新发布您的代码，并格式化以便于阅读:

this.taskHandle.find('img')
    .stop(true, true)
    .animate(
        {
            //todo//
            top:  vtop , // this.taskHandle.outerHeight(),
            //'top' : 0 - $('.target.upper').height(),
            width : 0,
            opacity : 0
        },
        {
            duration:2000,
            step: function() {
                console.log('I am called');
            }
        },
        $.proxy(
            function() {
                // some css clearing method
            },
            {
                // some further actions after animation completes
            }
        )
    );

首先:animate() 不接受 3 个参数(至少不是那 3 个参数)。我不确定你想用你的 css clearing method 做什么，但是你不想在动画完成后发生的任何事情都应该在 complete 方法中您在 step 方法旁边添加的。

第二:$.proxy() 需要有您希望它作为第二个参数运行的上下文，而不是其他一些“完整”函数。

所以这里是一个稍微修改过的例子。你可以在this fiddle中自己尝试.

var vtop = 100;

$('div')
    .stop(true, true)
    .animate(
        {
            top:  vtop,
            width: 0,
            opacity : 0
        },
        {
            duration: 2000,
            step: function() {
                console.log('I am called');
            },
            complete: function () {
                alert('complete');// some further actions after animation completes
            }
        }
    );