我想加载YouTube视频,然后立即静音,播放,暂停和取消静音。在这样做的过程中,我希望向用户展示一个没有大播放按钮的视频,并且底部有控件。为此,我有以下代码:
<script type="text/javascript">
function onYouTubePlayerReady(playerid)
{
mutePlayPauseUnmute(playerid);
}
function onYouTubePlayerAPIReady(playerid)
{
mutePlayPauseUnmute(playerid);
}
function onYouTubeIframeAPIReady(playerid)
{
mutePlayPauseUnmute(playerid)
}
function onPlayerReady(playerid)
{
mutePlayPauseUnmute(playerid)
}
function mutePlayPauseUnmute(playerid)
{
var player = document.getElementById(playerid);
player.mute();
player.playVideo();
player.pauseVideo();
player.unMute();
}
</script>
<iframe id="quotedVideo1" type="text/html" width="246" height="160" src="https://www.youtube.com/embed/NWHfY_lvKIQ?modestbranding=1&rel=0&showinfo=0&autohide=1&iv_load_policy=3&theme=light&enablejsapi=1&playerapiid=quotedVideo1" frameborder="0"> <!-- Magic Comment --> </iframe>
但是,经过检查,onYouTubePlayerReady
,onYouTubePlayerAPIReady
,onYouTubeIframeAPIReady
,onPlayerReady
和mutePlayPauseUnmute
都未被调用。 我做错了什么?根据https://developers.google.com/youtube/js_api_reference#onYouTubePlayerReady它看起来应该有效,但它没有。
答案 0 :(得分:11)
你在这里混淆了两个不同的播放器API。
您想使用 iframe播放器吗?如果是这样,您需要查看:https://developers.google.com/youtube/iframe_api_reference。
您需要定义以下方法,而不是定义onYouTubePlayerReady
:onYouTubeIframeAPIReady
,创建播放器,然后分配onPlayerReady
回调。
确保您包含iframe播放器API的JavaScript,以便调用onYouTubeIframeAPIReady
:
var tag = document.createElement('script');
tag.src = o.protocol + "://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
值得注意的是,因为您正在编写iframe而不是使用JavaScript来为您执行此操作:
如果你确实写了标签,那么当你构建标签时 YT.Player对象,您不需要指定宽度和值 height,指定为标记的属性,或者 videoId和player参数,在src URL中指定。
另外,在你的mutePlayPauseUnmute函数..
playerid.mute();
playerid.playVideo();
playerid.pauseVideo();
playerid.unMute();
您需要触发player
上的实际方法,而不是如上所述的playerid
。