Question

我的网站上有很多嵌入式YouTube视频的列表

 <div class="thumbnail">
          <iframe width="560" height="315" src="https://www.youtube.com/embed/2sZAeXBP0NE" frameborder="0" allowfullscreen></iframe> </div>

视频列表很大并且每天都在变化。

我正在寻找捕获开始视频事件的方法，所以我可以强制用户在看到视频之前接受TOS（使用弹出窗口）。我试图放置一个具有更高z-index的div并在那里放置一个onclick事件，但它不起作用/阻止用户观看视频。

Answer 1

所以我最终使用了YouTube API 几件事要提到

您必须使用div作为视频的占位符，例如

<div id="video3" class="video3"></div>

然后你可以声明一旦点击视频就会触发的回调函数

function onYouTubeIframeAPIReady() {
    video1 = new YT.Player('video1', {
      height: '315',
      width: '560',
      videoId: 'youtubeId',
      events: {
        'onStateChange': onPlayerStateChange
      }
    });

请注意，所有视频都必须加载到onYouTubeIFrameReady中，并且它们都可以指向相同的回调函数或不同的回调函数希望它有所帮助

使用javascript收听youtube iframe事件

1 个答案: