使用YouTube API设置视频开始时间 - "开始" playerVars选项用于工作,但现在不行?

时间:2014-05-23 04:50:06

标签: javascript youtube youtube-api youtube-javascript-api

我使用YouTube API撰写了this stupid toy。基本上它只是在不同的随机时间开始多个视频副本。这一年工作得很好。但是今天我注意到随机启动时间不再起作用,它只是在t = 0时启动所有视频(在多个浏览器/操作系统/计算机上测试)。

知道什么是错的吗?我只是将一个随机数传递给start参数。看似简单。

这是我的代码。关键部分位于add函数中,其中start参数在playerVars中设置。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Flockas</title>
  </head>
  <body>
<button id="pause">Pause Flockas</button>
<button id="add">Add One Flocka</button>
<button id="remove">Remove One Flocka</button>
<p>
<div id="flockas"></div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
var flockas = [];

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

function onPlayerReady(event) {
  event.target.playVideo();
}

function add() {
  var start = Math.random() * 60;

  $("#flockas").append('<div id="flocka' + flockas.length + '" class="flocka"></div>');

  flockas.push(new YT.Player('flocka' + flockas.length, {
    height: '105',
    width: '140',
    videoId: 'yOc-MXGuKgs',
    playerVars: {
      autoplay: 1,
      loop: 1,
      playlist: 'yOc-MXGuKgs',
      start: start
    },
    events: {
      'onReady': onPlayerReady
    }
  }));
}

function remove() {
  var divs = $(".flocka");
  $(divs[divs.length - 1]).remove();
  flockas.splice(flockas.length - 1)
}

function pause() {
  var pauseEl = $("#pause");
  if (pauseEl.html() === "Pause Flockas") {
    for (var i = 0; i < flockas.length; i++) {
      flockas[i].pauseVideo();
    }
    pauseEl.html("Play Flockas");
  } else {
    for (var i = 0; i < flockas.length; i++) {
      flockas[i].playVideo();
    }
    pauseEl.html("Pause Flockas");
  }
}

function onYouTubeIframeAPIReady() {
  for (var i = 0; i < 5; i++) {
    add();
  }
}

$("#add").click(add);
$("#remove").click(remove);
$("#pause").click(pause);
</script>
  </body>
</html>

就像我上面所说的那样,当我最初制作它时,这种方法很好用,而且我最近才注意到它不起作用。

1 个答案:

答案 0 :(得分:2)

start参数仍然有效。问题是,你为它计算了一个错误的值:错误的类型。 也许它已被改变: 提供有效的INTEGER值有效。 (如果允许分数,那么并非所有分数都有效。)

例如,如果您想要一个0到200之间的值,请使用:

  var maxVal = 200;
  var startVal = Math.ceil((Math.random() * maxVal));