javascript - 无法添加事件监听器？

Question

我在向 YT.player 添加事件列表器时似乎遇到问题。

var ytapi = document.createElement('script');
ytapi.src = "https://ww" + "w.youtube" + ".com/iframe_api";
var scriptref = document.getElementsByTagName('script')[0];
scriptref.parentNode.insertBefore(ytapi, scriptref);
window.players = [];

function onPlayerStateChange(event) {
    switch(event.data) {
        case YT.PlayerState.ENDED:
            alert('VIDEO IS ENDED');

        case YT.PlayerState.CUED:
            alert('VIDEO IS CUED');

        case YT.PlayerState.PAUSED:
            alert('VIDEO IS PAUSED'); 
            break;
    }
};

window.onYouTubeIframeAPIReady = function() {
    jQuery('iframe[src*="youtube.com"]').each(function() {
        var id = jQuery(this).attr('id');
        window.players[id] = new YT.Player(id);
        window.players[id].addEventListener('onStateChange','onPlayerStateChange');
    });
};

OnStateChange没有被触发，但是

如果我在浏览器控制台中执行

window.players[id].addEventListener('onStateChange','test');
function test(event){alert(event.data)};

有效吗？

我在代码中做的不是完全相同吗？那么为什么它只能在控制台中工作？

Answer 1

发生这种情况是因为 addEventListener(<string>, <string>)不是一个函数，如所述 here .

正如您所读到的，关于该方法的第二个参数:

This must be an object implementing the EventListener interface, or a JavaScript function. See The event listener callback for details on the callback itself.

因此不接受字符串。也许你想通过 test函数变量引用，而不是 test字符串。

所以，只需去掉引号即可:

addEventListener('onStateChange', test);

注意:一些 javascript 函数也接受字符串代替函数，例如 eval和setTimeout 。但不鼓励使用