YouTube 播放器 api - addEventListener() 对我不起作用？答案

【问题标题】：YouTube player api - addEventListener() does not work for me?YouTube 播放器 api - addEventListener() 对我不起作用？
【发布时间】：2010-04-18 02:45:07
【问题描述】：

我正在使用 youtube player api。我在这里关注文档：

http://code.google.com/apis/youtube/js_api_reference.html

在播放器上添加事件侦听器时出现问题，它似乎卡在了那里。我在后面直接放了一条警告语句，它永远不会被调用：

ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
alert("I never get called...");

知道为什么会发生这种情况吗？通过 FF chrome safari 运行它，同样的事情发生在所有人身上。其他播放器功能都可以正常工作。我正在使用 swfobject 版本。我也在服务器上实时运行。没看懂。

谢谢

【问题讨论】：

我也面临同样的问题很多天，我试图弄清楚。好吧，我意识到在 document.getElement.... 中传递的 id 应该仔细检查它应该是你的 swfobjects 属性 id。 var player = document.getElementById(atts.id);

标签： javascript youtube-api

【解决方案1】：

将您的回调放在全局命名空间中，例如 window.onytplayerStateChange = function。

虽然它非常糟糕，但它是我能够成功让回调工作的少数几种方法之一。有人告诉我它是因为 addEventListener 是一个自定义函数，它覆盖了通过全局命名空间中的字符串进行查找的本机代码。

【讨论】：

非常有用，谢谢。具有讽刺意味的是，我的事件监听器以前在 FF 中工作过，但不是 Chrome，但是通过将回调放在全局命名空间中，它在两者中都可以工作。

【解决方案2】：

看看这个页面的源代码，它可能会让你朝着正确的方向前进。视频下方的数字是您尝试实施的方式捕获和更新的视频状态

var ytplayer;

function onytplayerStateChange(newState) {
    document.getElementById('videoStatus').innerHTML = newState;
}

function onYouTubePlayerReady(playerId) {
    ytplayer = document.getElementById(playerId);
    ytplayer.addEventListener('onStateChange', 'onytplayerStateChange');
}

$(document).ready(function() {

    var params = {
        allowScriptAccess: "always"
    };

    var atts = {
        id: "ytplayer1"
    };

    swfobject.embedSWF("http://www.youtube.com/v/5dWnMu490Zk?rel=0&autoplay=1&enablejsapi=1&playerapiid=ytplayer1", "popupVideoContainer1", "853", "505", "9", null, {}, params, atts);

});

<div id="popupVideoContainer1">You need Flash and JavaScript in order to view the video.</div>
<div id="videoStatus">status</div>

【讨论】：

更新了链接。指向jsfiddle。由于不喜欢直接链接到 jsfiddle.net 的 URL 缩短器（真的吗？从什么时候开始？）请注意在 jsfiddle 附加资源中包含 jquery 1.7.2 和 SWFObject 2.2

【解决方案3】：

我认为这是一个错误。这是对我有用的解决方案：

在播放器 URL 中，您必须在 ? 之后包含一个“&”。所以例子是这样的：

VIDEO_ID?enablejsapi=1&playerapiid=ytplayer

但是改用这个：

VIDEO_ID?&enablejsapi=1&playerapiid=ytplayer

（注意“启用”之前的 &）

没有多大意义，但它现在可以工作了:)

【讨论】：