Question

我播放Youtube视频的嵌入代码是：

<object height="356" width="425" type="application/x-shockwave-flash" id="myytplayer" data="http://www.youtube.com/v/MTf6qXn5Prw?enablejsapi=1&amp;playerapiid=ytplayer&amp;version=3"><param name="allowScriptAccess" value="always"></object>

我想跟踪Youtube播放器的事件（播放/暂停/停止等）

以下代码独立运作

window.onYouTubePlayerReady = function(playerId){
 ytplayer = document.getElementById("myytplayer");
  ytplayer.addEventListener("onStateChange", "onytplayerStateChange");

}

window.onytplayerStateChange = function (newState) {
  alert("Player's new state: " + newState);

}

我正在使用YUI。

当我把它放在

中时

YUI.add('module-name', function(Y) {

[some other code...]

window.onYouTubePlayerReady = function(playerId){
 // console.log(playerId); console.log(ytplayer);
  ytplayer = document.getElementById("myytplayer");

  ytplayer.addEventListener("onStateChange", "onytplayerStateChange");

}

window.onytplayerStateChange = function (newState) {
  alert("Player's new state: " + newState);

}

},'3.4.0', {requires:'module-a', 'module-b'})

函数onytplayerStateChange适用于Firefox和Safari，但不适用于其他浏览器。

然后我尝试使用YUI函数使其在所有浏览器中都能正常工作，因此我做了一些更改

window.onYouTubePlayerReady = function(playerId){
  var shinyPlayer = Y.one("#myytplayer");
  shinyPlayer.on('onStateChange', function (e) {
            e.preventDefault();
            alert('here');
        });
}

但它对我不起作用。

我不想将window.onytplayerStateChange放在YUI.add之外（'module-name'，function（Y）{}）

请建议我如何在所有浏览器中跟踪Youtube播放器的状态。

提前致谢。

Answer 1

我做了一个jsFiddle测试这个：

http://jsfiddle.net/2Mj6b/4/

对我而言，感觉addEventListener是Google的自定义实现。通常，第二个参数是回调/函数指针，没有字符串。

如果将变量附加到窗口对象，它将变为全局变量，并且来自每个可见范围。因此，如果在YUI模块中定义它，则没有问题。

第二个问题是你不能使用播放器作为YUI对象，你必须留在dom对象上才能完成这项工作。

哦，这是一个老问题。该死的。但无论如何我会发布这个。 ;）

在YUI.add中跟踪Youtube播放器的状态

1 个答案: