YouTube API视频播放器无法在移动设备上运行,即使我取出了自动播放功能

时间:2014-06-16 20:52:32

标签: jquery mobile responsive-design youtube-api

我正在网站主要部分播放YouTube视频。它加载并在桌面上播放正常但在移动设备上它开始加载,给出一个空白的黑屏,然后什么也没有。我已经尝试取出那些被描述为不能在移动设备上工作但仍然没有运气的活动。有没有其他人在这段代码中看到我遗漏的东西?提前谢谢!

JS

//Load player api asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var done = false;
var player;


function onYouTubeIframeAPIReady() {
    // if (typeof videoId === "undefined")
    //   var videoId = false;
    player = new YT.Player('youtube-video', {
      height: '390',
      width: '640',
      videoId: videoId,
      playerVars: {
            html5: 1,
      },
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
}
function onPlayerReady(evt) {
    if( videoAutoPlay ) {
      $('#video-bg-image').fadeOut(1000);
        evt.target.playVideo();
    }
}
function onPlayerStateChange(evt) {
  if(evt.data === 0 || evt.data === 2)
    $('#video-bg-image').stop(true, true).fadeIn(400);

  console.log(evt);
    // if (evt.data == YT.PlayerState.PLAYING && !done) {
    //     setTimeout(stopVideo, 6000);
    //     done = true;
    // }
}
function stopVideo() {
    player.stopVideo();
}
function playVideo() {
  player.playVideo();
}

1 个答案:

答案 0 :(得分:1)

尝试删除onPlayerReady()中的自动播放功能(evt.target.playVideo())。