动画：finish() 方法

基线 广泛可用

此功能已完善，并在许多设备和浏览器版本上运行。它自 2020 年 3 月.

finish() 方法是 Web 动画 API 的 Animation 接口，用于将当前播放时间设置为与当前播放方向相对应的动画末尾。

也就是说，如果动画正向播放，它将播放时间设置为动画序列的长度，如果动画反向播放（已调用其 reverse() 方法），则它将播放时间设置为 0。

语法

js
finish()

参数

无。

返回值

无 (undefined).

异常

InvalidState

播放器的播放速率为 0 或动画的播放速率大于 0 且动画的结束时间为无穷大。

示例

以下示例展示了如何使用 finish() 方法并捕获 InvalidState 错误。

js
interfaceElement.addEventListener("mousedown", () => {
  try {
    player.finish();
  } catch (e) {
    if (e instanceof InvalidState) {
      console.log("finish() called on paused or finished animation.");
    } else {
      logMyErrors(e); //pass exception object to error handler
    }
  }
});

以下示例将完成单个元素上的所有动画，无论其播放方向。

js
elem.getAnimations().forEach((animation) => animation.finish());

规范

规范
Web 动画
# dom-animation-finish

浏览器兼容性

BCD 表格仅在浏览器中加载

另请参见