可以在YouTube iframe上添加onclick事件吗？

Question

可以在YouTube iframe上添加onclick事件吗？

lei*_*ing 3 html javascript youtube iframe

我有一个带有HTML5音频播放器和嵌入式YouTube音乐视频的网站.我想这样做,以便当用户点击YouTube视频播放时,音乐将停止.包装iframe

<div id='vidWrapper' onclick='pauseAudio()'>YT stuff</div>

适用于iframe之外的像素条,但不是在您点击实际视频时.有人有主意吗？

Answer 1

fro*_*dqy 6

您应该使用YouTube IFrame API.添加事件侦听器,onStateChange以便在玩家状态发生变化时收到通知.请参阅下面的示例代码.

<!DOCTYPE html>
<html>
  <head>
    <script src="https://www.youtube.com/iframe_api"></script>
  </head>
  <body>
    <div id='vidWrapper'>
      <!-- The <iframe> (and video player) will replace this <div> tag. -->
      <div id="ytplayer"></div>
    </div>

    <script>
      var player;

      function onYouTubeIframeAPIReady() {
        player = new YT.Player('ytplayer', {
          height: '390',
          width: '640',
          videoId: 'M7lc1UVf-VE',
          events: {
            'onStateChange': function(event) {
              if (event.data == YT.PlayerState.PLAYING) {
                pauseAudio();
              }
            }
          }
        });
      }

      function pauseAudio() {
        ...
      }
    </script>
  </body>
</html>

Run Code Online (Sandbox Code Playgroud)

归档时间：	10 年，6 月前
查看次数：	8450 次
最近记录：	10 年，6 月前