Question

每当有人点击嵌入式YouTube视频上的“播放”按钮时，我想运行一个名为stopSlide的函数。或者甚至在嵌入式视频中点击任何位置时运行该功能对我来说也可以正常工作。

我该怎么做？

Answer 1

有一个提供事件回调的YouTube JavaScript API。

遗憾的是，没有办法直接检测点击事件（至少我不知道）。但是，您可以检测播放器状态的变化，您可以使用onStateChange。

首先，您需要通过使用特殊URL嵌入JS API来启用播放器中的JS API：

http://www.youtube.com/v/VIDEO_ID?version=3&enablejsapi=1

然后你需要创建一个事件处理函数：

function player_state_changed(state) {
  /* This event is fired whenever the player's state changes.
     Possible values are:
     - unstarted (-1)
     - ended (0)
     - playing (1)
     - paused (2) 
     - buffering (3)
     - video cued (5). 
     When the SWF is first loaded it will broadcast an unstarted (-1) event.
     When the video is cued and ready to play it will broadcast a video cued event (5).
  */

  if (state == 1 || state == 2) {
    alert('the "play" button *might* have been clicked');
  }

}

最后，您需要确保每当电影的状态发生变化时都会调用处理程序：

document.getElementById('MY-PLAYER-ID').addEventListener('onStateChange', 'player_state_changed');

Answer 2

可能会有所帮助......根据您的要求进行编辑 http://jsfiddle.net/masiha/4mEDR/

Answer 3

我尝试使用上面的建议，但没有成功。它无法处理计时器滑块。请参阅Google自动滑块示例，他们使用弹出窗口播放视频。 google slider with embedded video

Answer 4

据我所知，您无法在iframe中检测到点击，也无法触发iframe中的任何点击事件我的解决方案是在iframe中放置一个按钮，将其属性设置为该按钮内部的transparent（opacity），您可以使用playmethod调用click函数，并可以启用自动播放的pause方法

Answer 5

您需要在播放器上注册一个事件监听器来调用您的stopSlide功能。以下代码行应该为您完成（首先您必须用适当的值替换两个“ strings ” - 嵌入式播放器的ID，以及您想要的函数的名称呼叫。例如：“stopSlide”）：

document.getElementById("_idOfEmbeddedPlayerElement_").addEventListener("onStateChange", "_nameOfFunctionToCall_");`

挂钩点击嵌入式YouTube播放器内的事件

5 个答案: