vimeo 视频停止播放时触发事件？答案

【问题标题】：Fire event when vimeo video stops playing?vimeo 视频停止播放时触发事件？
【发布时间】：2013-01-15 12:43:00
【问题描述】：

我只是想知道是否可以在 vimeo 视频播放完毕后触发事件？

目前我在叠加层中嵌入了一个 Vimeo，我想在视频停止后将其删除。希望这是有道理的！

我真的没有任何有用的代码，但想知道您是否可以向视频添加事件侦听器，在视频结束后触发事件，以及您将如何执行此操作？

谢谢瑞恩

【问题讨论】：

使用their new library如this answer所示

标签： html video jquery vimeo

【解决方案1】：

自从 Vimeo 推出新的Video Player API 以来，以前的答案现已过时。

重要提示：请务必删除您 iframe 中网址中的 ?api=1。这是以前使用 Froogaloop 库时需要的，现在不再需要。如果你把它留在里面，'end'、'seeked' 和其他事件将永远不会触发。

包含新脚本：

<script src="https://player.vimeo.com/api/player.js"></script>

然后使用下面的例子：

$(document).ready(function(){

    var iframe = $('#container iframe');
    var player = new Vimeo.Player(iframe);

    player.on('ended', function() {
        console.log('Finished.');
    });

});

【讨论】：

这是一个有效的答案。 +1 感谢您回答这个老问题。
不错！请注意，它也可以通过 npm 和 bower 获得

【解决方案2】：

首先，您需要在您的 HTML 中包含 Vimeo 的“Frogaloop 库的路径”（在您的 Jquery 包含之后）：

<script src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>

然后你需要嵌入你的 Vimeo 视频（同样在你的 HTML 中）：

<iframe id="PLAYER1" src="https://player.vimeo.com/video/76979871?api=1&player_id=PLAYER1" width="630" height="354" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

这里的 'api=1' 打开 api - 为了提高性能默认关闭。而且，player_id='PLAYER1' 是你的 iframe 的 id。

然后在您的 JavaScript 文件中，您需要以下内容：

$(function() {

    //Gets the iframe by id
    var iframe = $('#PLAYER1');
    //Creates a player var using the iframe
    var player = $f(iframe);

    // When the player is ready/loaded, add a finish event listener
    player.addEvent('ready', function() {
        //Adds an event 'finish' that executes a function 'onFinish' when the video has ended.
        player.addEvent('finish', onFinish);
    });

    //Define the onFinish function that will be called
    function onFinish(id) {
        console.log('THE VIDEO HAS FINISHED PLAYING');
    }

});

然后只需播放视频，并检查控制台输出。

Here is a link 到文档的相应部分。

感谢 @Raptor 将我指向 api 文档。

【讨论】：

Froogaloop 已“弃用”，请使用their new library，如this answer所示

【解决方案3】：

http://developer.vimeo.com/player/js-api

查看此页面，尤其是事件监听器部分。如果您需要更多帮助，我相信我也可以在上面写一些代码？

【讨论】：