javascript - 如何在不链接到播放列表的情况下播放两个 Youtube 视频?

标签 javascript iframe youtube

我对 JavaScript 很陌生。我在这里嵌入了一个 youtube iframe: http://www.heartlandpokertour.com/indexbeta.php

使用本文档: http://code.google.com/apis/youtube/iframe_api_reference.html

我想要在第一个视频播放完毕后循环播放第二个视频。如果我尝试将视频 ID 链接/设置到 YouTube 播放列表,我将无法设置特定视频参数。

我假设我需要设置一个事件监听器和函数以在广播 YT.PlayerState.ENDED(或 0)时触发,但不知道如何执行此操作。

更新:这是我用于播放器的当前代码:

<script>
  // 2. This code loads the IFrame Player API code asynchronously.
  var tag = document.createElement('script');
  tag.src = "http://www.youtube.com/player_api";
  var firstScriptTag = document.getElementsByTagName('script')[0];
  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

  // 3. This function creates an <iframe> (and YouTube player)
  //    after the API code downloads.
  var player;
  function onYouTubePlayerAPIReady() {
    player = new YT.Player('player', {
      height: '258',
      width: '406',
      videoId: 'MsTQNZmq5Pk',
      playerVars: { 'autoplay': 0, 'rel': 0, 'showinfo': 0, 'egm': 0, 'showsearch': 0, },
      events: {
        'onStateChange': onPlayerStateChange,
      }
    });
  }

  // 4. The API will call this function when the video player is ready.     
    function onPlayerStateChange(event) {
        if (event.data == YT.PlayerState.ENDED) {
        player.stopVideo();
        player.videoId = 'c5dTlLk5_x8';
        player.playVideo();
        }
    }


</script>

最佳答案

在 API 网站上的第一个代码 list 中,此事件可能会帮助您:

  function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING && !done) {
      setTimeout(stopVideo, 6000);
      done = true;
    }
  }

您可以将其更改为这样的内容(恐怕没有经过测试):

  function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.ENDED) {
      player.stopVideo();
      player.videoId = 'some id';
      player.playVideo();
    }
  }

在我看来,这是最合乎逻辑的,但我再次不确定是否可以在一个播放器实例中播放不同的视频。恐怕我从未遇到过你的情况。

<小时/>

编辑:您可以尝试创建播放器的新实例。所以基本上你只需创建一个新播放器,它将播放第二个视频:

 function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.ENDED) {
      player.stopVideo();

      player = new YT.Player('player', {
         height: '258',
         width: '406',
         videoId: 'some id',
         playerVars: { 'autoplay': 0, 'rel': 0, 'showinfo': 0, 'egm': 0, 'showsearch': 0, },
         events: {
           //'onStateChange': onPlayerStateChange, // not add this line because it would again create a new player after the second has stopped I guess!
         }
      });

      player.playVideo();
    }
  }

关于javascript - 如何在不链接到播放列表的情况下播放两个 Youtube 视频?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4950837/

相关文章:

javascript - 获取特定字符串和特殊字符之间的字符串

javascript - 使用 Greasemonkey 删除图像?

Android Youtube API 可用吗?

javascript - IE 中 iframe 元素的线程

ios - Google 数据 API - 访问未配置错误

javascript - html youtube 自定义播放按钮

javascript - 谁在传递参数来替换函数?

javascript - 我的 javascript 代码在 pc 上运行但不在 android 或 ios 上运行

javascript - 有没有办法查看 window.top 是否可访问?

javascript - 如何根据屏幕宽度控制&lt;iframe&gt;滚动参数?