Question

我有一个来自Javascript代码段的YouTube视频。该功能允许章节选择onClick - 允许用户在不同时间播放视频（startSeconds） - 视频不会加载直到刷新页面，或随机播放。我第一次加载页面，没有骰子。在控制台中没有显示任何内容，我在Chrome和Safari中使用相同的结果对其进行了测试。

我的代码：

<div id="player"></div>

<script type="text/javascript">
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 player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
  width: '800',
  videoId: 'YQY9BZBrZds',
  events: {
    'onStateChange': onPlayerStateChange    
  },
  playerVars:{
    rel: 0,
    wmode: "opaque"
  }         
});
}

function onPlayerStateChange(evt) {
if (evt.data == 0) {
      $('#video_popup').removeClass('hide_pop');
      $('#video_popup').addClass('display_pop');
}
else if (evt.data == -1) {
      $('#video_popup').removeClass('display_pop');
      $('#video_popup').addClass('hide_pop');
}
else {
      $('#video_popup').removeClass('display_pop');
      $('#video_popup').addClass('hide_pop');
 }
 }

function chapter1() {
//player.loadVideoById({'videoId': 'YQY9BZBrZds', 'startSeconds': 0});
  player.cueVideoById('YQY9BZBrZds', 0);
  player.playVideo();
}

function chapter2() {
//player.loadVideoById({'videoId': 'YQY9BZBrZds', 'startSeconds': 22});
player.cueVideoById('YQY9BZBrZds', 22);
player.playVideo();
}

function chapter3() {
//player.loadVideoById({'videoId': 'YQY9BZBrZds', 'startSeconds': 44});
player.cueVideoById('YQY9BZBrZds', 44);
player.playVideo();
}

function chapter4() {
//player.loadVideoById({'videoId': 'YQY9BZBrZds', 'startSeconds': 87});
player.cueVideoById('YQY9BZBrZds', 87);
player.playVideo();
}

function chapter5() {
 //player.loadVideoById({'videoId': 'YQY9BZBrZds', 'startSeconds': 149});
player.cueVideoById('YQY9BZBrZds', 149);
player.playVideo();
}

我的网站： Click here http://design.vast42.com/rcity/redux/

正如您所看到的，根据1 2 3说明，视频就在那里。

我从先前的S.O.获得了此代码。发布/ JSBin： Link to source YouTube API loadVideoById startSeconds not working

感谢能够提供见解的任何人！

Answer 1

我认为你不应该使用cueVideoById。此功能将视频添加到播放器的提示中。然而，这是同一个视频。

此功能可加载指定视频的缩略图并准备播放器播放视频。

您应该使用seekTo功能。它会将您的视频设置到正确的位置，而无需重新加载视频。

寻找视频中的指定时间。如果在调用该功能时播放器暂停，它将保持暂停状态。如果从其他状态（播放，视频提示等）调用该功能，播放器将播放视频。

文档：https://developers.google.com/youtube/js_api_reference?hl=en#seekTo

您的功能应如下所示：

function chapter1() {
    player.seekTo(0);
}

YouTube Javascript嵌入无法加载，直到页面刷新

1 个答案: