YouTube 视频结束时的事件 [英] Event when YouTube video finished

查看:36
本文介绍了YouTube 视频结束时的事件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有简单的 html 代码,可以在点击图片后播放 YouTube 视频:

<script type="text/javascript";src=http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><div id="ytapiplayer2";样式=显示:无;"><对象宽度=1280"高度=745"><参数名称=电影"value=http://www.youtube.com/v/kCfP003Btjw?fs=1&hl=en_US&rel=0&autoplay=1"</param><param name="allowFullScreen";value=true"></param><param name=allowscriptaccess"值=总是"></param><embed src="http://www.youtube.com/v/kCfP003Btjw?fs=1&hl=en_US&rel=0&autoplay=1";类型=应用程序/x-shockwave-flash";允许脚本访问=总是"允许全屏=真"宽度=1280"height=745"</embed></对象>

<img src=https://i.qmyimage.com/mgen/global/zGetImageNew.ms?args=%22shpimg4198.jpg%22,425,96,1"id=图像ID"/><script type="text/javascript">$('#imageID').click(function() {$('#ytapiplayer2').show();$('#imageID').hide();});

视频播放完毕后,我需要隐藏视频并显示图像.如何实现?

解决方案

Youtube 有一个 JavaScript API:https://developers.google.com/youtube/js_api_reference

您需要的是 onStateChange 事件,它会在结束时为您提供 0.

player.addEventListener("onStateChange", function(state){如果(状态 === 0){//视频结束,在这里做点什么.}});

I have simple html code that plays YouTube video after click on the image:

<body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 

<div id="ytapiplayer2" style="display:none;">
<object width="1280" height="745">
<param name="movie" value="http://www.youtube.com/v/kCfP003Btjw?fs=1&hl=en_US&rel=0&autoplay=1"></param>
<param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/kCfP003Btjw?fs=1&hl=en_US&rel=0&autoplay=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="1280" height="745"></embed>
</object>

</div>


<img src="https://i.qmyimage.com/mgen/global/zGetImageNew.ms?args=%22shpimg4198.jpg%22,425,96,1" id="imageID" />
<script type="text/javascript">
$('#imageID').click(function() {
$('#ytapiplayer2').show();
$('#imageID').hide();
});
</script>
</body>

I need hide the video and show image back, after video finished play. How is it possible to implement?

解决方案

Youtube has a JavaScript API: https://developers.google.com/youtube/js_api_reference

What you need is the onStateChange event, which will give you 0 when ended.

player.addEventListener("onStateChange", function(state){
    if(state === 0){
        // the video is end, do something here.
    }
});

这篇关于YouTube 视频结束时的事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆