视频结束时的 Youtube 嵌入操作

Posted 2023-03-07

【中文标题】视频结束时的 Youtube 嵌入操作

【英文标题】：Youtube embeded action when video ends

【发布时间】：2011-07-08 13:10:47

【问题描述】：

我想知道嵌入视频完成后是否可以使用 youtube api 进行操作。例如，在我的网络中，我在悬停一个元素时开始播放视频，但我希望视频完成后被静态图像替换。我该怎么做？

【问题讨论】：

我研究了 youtube api，我认为应该使用 player.addEventListener 完成，但不知道如何

【参考方案1】：

我有 wordpress 并在以下步骤中使用： 已安装http://www.tikku.com/jquery-youtube-tubeplayer-plugin

然后将此代码添加到页面中 但要更改 1) yoursite.com 到您的 2) alert("Hello"); 到您想要的另一个功能； 3) DkoeNLuMbcI 到所需的视频 ID；

<div id="youtube-player-container" style="float:right"> </div>
<script type="text/javascript" src="http://yoursite.com/folder/jQuery.tubeplayer.min.js"></script>
<script type="text/javascript">
jQuery("#youtube-player-container").tubeplayer(
    width: 422, // the width of the player
    height: 285, // the height of the player
    allowFullScreen: "true", // true by default, allow user to go full screen
    initialVideo: "DkoeNLuMbcI?autoplay=1", // the video that is loaded into the player
    preferredQuality: "default",// preferred quality: default, small, medium, large, hd720
    onPlay: function(id), // after the play method is called
    onPause: function(), // after the pause method is called
    onStop: function(), // after the player is stopped
    onSeek: function(time), // after the video has been seeked to a defined point
    onMute: function(), // after the player is muted
    onPlayerEnded: function() alert("Hello"); ,
    onUnMute: function() // after the player is unmuted
);
</script>

【参考方案2】：

使用http://www.tikku.com/jquery-youtube-tubeplayer-plugin

它让一切变得简单。设置完成后，应该不会花很长时间（有一个简单的操作方法），只需将此行添加到您的播放器启动中：

    onPlayerEnded: function() // Do something here ,

这将在播放器结束后执行您想要的任何操作。当播放器暂停、停止、播放、静音、取消静音、排队等时，还有回调

让我知道这是否有效，或者如果您在使用 jquery 插件时遇到问题。这真的非常有用且简单！