Question

我想实现一个jQuery动画回调方法进度或步骤，

但在任何一种情况下我都会收到以下错误：

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

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

在小提琴中，我尝试了步骤和进度并在那里工作，但是无法在我的代码中使用它，我只是在寻找，有些人在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()需要将您希望它作为第二个参数运行的上下文，而不是其他一些＆＃34;完成＆＃34; -function。

所以这是一个稍微修改过的例子。您可以在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
            }
        }
    );

Answer 2

您可以使用Julian Shapiro的 Velocity.js ，其动画（可论证）比jQuery和CSS更快（read this更多）

它允许您使用回调，例如：

开始
进步
完整

喜欢：

var vtop = 100;
jQuery(document).ready(function ($) {
    $('div').find("img").velocity({
        top: vtop,
        width: 0,
        opacity: 0
    }, {
        duration: 2000,
        begin: function (elements) {
            console.log('begin');
        },
        progress: function (elements, percentComplete, timeRemaining, timeStart) {
            $("#log").html("<p>Progress: " + (percentComplete * 100) + "% - " + timeRemaining + "ms remaining!</p>");
        },
        complete: function (elements) {
            // some further actions after animation completes
            console.log('completed');
            $.proxy( ... ); // some css clearing method
        }
    });
}); // ready

注意您只需要.animate()替换.velocity()

参见 JSFIDDLE

jQuery动画设置回调引发错误

2 个答案: