javascript - 如何将 jQuery 事件处理程序附加到 YouTube 电影？

Question

[编辑:对那些已经回答的人表示抱歉 -- 在我 sleep 不足的状态下，我忘记了这种特殊情况是 YouTube 电影，而不是 JW FLV 播放器。我看到有更多关于与 YouTube 电影互动的文档，所以我会继续研究，但也欢迎提供更多信息]

我在使用 jQuery 循环插件 (http://malsup.com/jquery/cycle/) 旋转的 div 集合中使用嵌入式 YouTube 视频。

当我点击其中一部电影开始播放时，我希望循环停止，但我不知道如何将 jQuery 事件处理程序附加到播放器对象。

这是我当前代码的样子(你不能直接用 jQuery 选择对象标签，所以我选择父 div，然后将对象元素作为第一个子元素):

$("div.feature-player").children(":first").click(function(event) {
   $('#features').cycle('stop');
});

但这并不能解决问题。我不是 Flash 作者，所以我不太熟悉 ActionScript，而且我以前从未在 JavaScript 和 Flash 影片之间设置交互。

Answer 1

YouTube 播放器 API 非常简单。您只需监听 onStateChange 事件并根据状态控制循环插件:

这是一个工作演示:http://jsbin.com/izolo (可通过 http://jsbin.com/izolo/edit 编辑)

相关代码:

function handlePlayerStateChange (state) {
  switch (state) {
    case 1:
    case 3:
      // Video has begun playing/buffering
      videoContainer.cycle('pause');
      break;
    case 2:
    case 0:
      // Video has been paused/ended
      videoContainer.cycle('resume');
      break;
  }
}

function onYouTubePlayerReady(id){
  var player = $('#' + id)[0];
  if (player.addEventListener) {
    player.addEventListener('onStateChange', 'handlePlayerStateChange');
  }
  else {
    player.attachEvent('onStateChange', 'handlePlayerStateChange');
  }
}