Question

这是我的jquery代码：

/* videoplayer controls */
$('#sjvslider li a').bind('click', function() {
$('#sjvslider li a').removeClass('active');
$(this).addClass('active'); // sets the thumbnail that what just clicked.
var vidNum = $(this).attr('rel');
var myVid = $("#video"+vidNum+"").html();
$('.videoplayer').html(myVid);
});

这是我的HTML：

<div id="videoDiv" class="videoplayer"></div>

<div id="video1" >
<object width="508" height="273" id="myytplayer" data="http://www.youtube.com/v/CezWPkoWXbY?version=3&amp;hl=en_US&amp;rel=0&amp;enablejsapi=1&playerapiid=ytplayer">
 <param name="allowscriptaccess" value="always">
 <param name="bgcolor" value="#000">
 </object>
 </div>
 <div id="video2" class="novideo">
 <object width="508" height="273" id="myytplayer" data="http://www.youtube.com/v/qhluM6nrCVs?version=3&amp;enablejsapi=1&playerapiid=ytplayer">
 <param name="allowscriptaccess" value="always">
 <param name="bgcolor" value="#000">
 </object>
 </div>

然后我与一些textlinks有一些链接，以获得正确的videoID。

<ul id="sjvslider">
<li><a href="#" rel="1">VIDEO 1</a></li>
<li><a href="#" rel="2">VIDEO 2</a></li>
</ul>

最终我要做的是在用户点击其中一个链接并播放视频后，当视频停止播放时，我希望它消失，因为我想要再次显示的视频下方有背景图像。 / p>

有没有办法用jquery做这个，也许可以访问youtube api？

Answer 1

是的，您希望使用API的player.addEventListener()方法添加事件侦听器并侦听onStateChange事件。它根据玩家的状态（播放，暂停，结束等）广播一个数字（0表示停止，2表示暂停等）。当该事件由“停止”状态触发时，您可以将jQuery函数发送到.hide()或.remove()或任何电影容器。

http://code.google.com/apis/youtube/js_api_reference.html#Events（player.addEventListner（）文档正好在上面该页面上的锚点，仅供参考。否则很容易错过。

编辑：请注意，您需要按照here所述为嵌入式视频启用YouTube API。

jquery youtube api - 当视频停止播放时，我希望它消失

1 个答案: