Chrome 扩展程序：单击事件侦听器不会启动答案

【问题标题】：Chrome extension: Click Event Listener won't initiateChrome 扩展程序：单击事件侦听器不会启动
【发布时间】：2013-03-20 23:34:24
【问题描述】：

我正在开发一个 Chrome 扩展程序，并且每当我尝试向类添加“点击”事件时都会返回一个错误。

Error in event handler for 'undefined': Object #<NodeList> has no method 'addEventListener' TypeError: Object #<NodeList> has no method 'addEventListener'

这是我的函数代码 (popup.js)

listElements: function(elements) {
    iHTML = '';
    for (var i = 0; i < elements.length; i++) {
        ...
        ...
        iHTML += '<div class="theBtn">btn</div>';
        ...
        ...
    }

    $('popup_content').innerHTML = iHTML;

    var btnElements = document.getElementsByClassName('theBtn');
    if (btnElements.length > 0) {
        btnElements.addEventListener("click", clicked);
    }
}

我也尝试了 each() ，但也没有用。相同的错误信息。它也完美地记录了“btnElements”。有什么想法吗？

谢谢！

【问题讨论】：

标签： javascript jquery google-chrome javascript-events google-chrome-extension

【解决方案1】：

因为你使用的是 jQuery 而不是

var btnElements = document.getElementsByClassName('theBtn');
if (btnElements.length > 0) {
    btnElements.addEventListener("click", clicked);
}

订阅点击事件为：

$('.theBtn').click(clicked);

getElementsByClassName 返回 NodeList，您不能将事件作为btnElements.addEventListener 附加到它。但是，这应该有效：

var btnElements = document.getElementsByClassName('theBtn');
for (var i = btnElements.length; i--;) {
    btnElements[i].addEventListener("click", clicked);
}

【讨论】：

没想到...效果很好，谢谢！