javascript - Web动画API回调函数

Question

我刚刚发现了 Web Animations API ，我正在尝试弄清楚如何为这些动画引入回调函数。我尝试使用以下方法

$('.box_wrapper')[0].animate([
    { right: '-100%' },
    { right: 0 }
], {
    fill: 'forwards',
    duration: 1000,
    onfinish: function() {
        // do stuff
    }
});

查看关于 this section 的 w3c 规范我认为 onfinish 属性是我需要使用的，但没有任何反应。

我也尝试过使用 jQuery 回调语法；

$('.box_wrapper')[0].animate([
    { right: '-100%' },
    { right: 0 },
], {
    fill: 'forwards',
    duration: 1000
}, function() {
    // do stuff
});

当然这也行不通。任何想法，我敢肯定这很简单，我只是还没能找到相关信息。

Answer 1

我差一点就做对了，像这样稍微调整一下，回调就起作用了；

$('.box_wrapper')[0].animate([
    { right: '-100%' },
    { right: 0 }
], {
    fill: 'forwards',
    duration: 1000
}).onfinish = function() {
    // do stuff
};