如何解决使用 loadVideoById() 函数自动播放 YouTube 视频不起作用
我为自定义 youtube 播放器创建了一个小部件,该小部件显示多个视频,然后单击打开视频并使用 onYouTubeIframeAPIReady() 和 loadVideoById() 自动播放它。作为独立的小部件,一切正常。但是一旦我在 iframe 中使用这个小部件在其他页面上调用它,自动播放就不起作用。我不确定这有什么问题。下面是相同的示例代码。
var youtube_Ids = ["N71Nd-KLUSo","c35LK3qXJ5Q","Q8aFElBusk4","Kq7vz3Ju_a0","8sZ5maCXsh0","XI1FcgCDoZk","ayQEyZExXCQ","GGhTL8u-2IY","RKMFNIC4_bM","-41Sx2Izve4","Lfjo5LFse_8","Fi13t258FkA","_5WM_Lb33U4","-McEFfJCBqA","msKkKDi-4RI","_VTF3sWcBwE","f23dG3tFBTk","KcP_8KH37TU","n76Vl85U_zU","fPbhZJ4mlEI"];
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag,firstScriptTag);
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player',{
videoId: youtube_Ids[0],//'N71Nd-KLUSo',playerVars: { 'autoplay': 1,},events: {
'onReady': onPlayerReady,'onStateChange': onPlayerStateChange
}
});
}
function onPlayerReady(event) {
console.log('started');
}
function onPlayerStateChange(event) {
if(event.data === 0) {
console.log('done');
}
}
$( document ).on( "click",".video-link",function(e) {
e.preventDefault();
var videoID = $(this).attr('data-videoID');
player.loadVideoById(videoID);
});
Works fine if i use this as independent widget. But as soon as use it as source for another iframe,it works fine except on clicking of a specific video,it doesnt autoplay and requires one more user action to play the video -
<iframe id="iframe1" scrolling="no" style="width:100%;border:none;height:100%;" src="http://example.com/youtubeplayer"></iframe>
Have tried using player.playVideo / event.target.playVideo() - inside onPlayerReady function with no success. Any Sort of help will be appreciated,as i am a newbie in iframes & this youtube APIs.
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。