Question

无论如何都要延迟youtube视频的自动启动，例如：“20秒后，页面加载后？”

以下是自动启动的示例：

由于

Answer 1

这不是完美的解决方案，但它有效，

<iframe class="delayed" width="486" height="273" frameborder="0" data-src="__url__" allowfullscreen=""></iframe>

请注意，我使用的是data-src而不是'src'

$(document).ready(function() {
    setTimeout(function() { 
        $('iframe.delayed').attr('src', 
                                     $('iframe.delayed').attr('data-src')); 
    }, 20000);
}

它会在页面加载后20秒加载iframe。看到我的前叉：http://jsfiddle.net/WswGV/

Answer 2

最好的方法是使用带有Javascript功能的YouTube.API。

 // Load the IFrame Player API code asynchronously.
    setTimeout(function() {
        player.playVideo();
    }, 20000);
      var tag = document.createElement('script');
      tag.src = "https://www.youtube.com/player_api";
      var firstScriptTag = document.getElementsByTagName('script')[0];
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

  // Replace the 'ytplayer' element with an <iframe> and
  // YouTube player after the API code downloads.
    var player;
    function onYouTubePlayerAPIReady() {    
        player = new YT.Player('ytplayer', {
          height: '315',
          width: '560',
          videoId: 'I_V_kIzKKqM'
        }); 
    }

我希望这个帮助

Answer 3

我认为上面提到的IFrame YouTube API的链接已经过时，但我今天发现了这个链接：

https://developers.google.com/youtube/iframe_api_reference

希望我很久以前就读过这篇文章。

为了从那里的示例中摘录，我建议您检测正在下载并准备好的播放器，然后设置所需秒数的计时器（我认为为20），然后播放视频。< / p>

--- v

Answer 4

使用https://developers.google.com/youtube/iframe_api_reference这会在视频自动启动前添加10秒延迟：

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

<script>
  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', {
      height: '390',
      width: '640',
      videoId: 'M7lc1UVf-VE',
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
  }

  function onPlayerReady(event) {
    setTimeout(function() {
        event.target.playVideo();
    }, 10000);
  }

  function stopVideo() {
    player.stopVideo();
  }
</script>

Answer 5

我使用以下功能

jQuery(document).ready(function () {
    var frame = jQuery('.embed-responsive iframe');
    var src = frame.attr('src');
    setTimeout(function(){ frame.attr('src', src+'?autoplay=1'); }, 20000);
});

Youtube延迟自动启动视频

5 个答案: