无法在Chrome扩展程序中添加监听器

Question

我正在尝试创建铬扩展名，但是无法以正确的方式将侦听器附加到按钮上。 必须注意的是，我对js不太熟悉，因此问题出在某些误解的概念或某些元素加载的时间上。

"background" : {"page" : "kbm.html"}

我正在使用清单v2，因此禁用了内联js，因此我尝试在回调中添加侦听器

这是kbm.html：

<!DOCTYPE html>
<html>
    <head>
        <script src="kbm.js"></script>
    </head>
    <body>
        <button id="loadall">Open all saved</button>
    </body>
</html>

这是kbm.js：

chrome.browserAction.onClicked.addListener(
        function(tab) {
            chrome.tabs.create( {'url': chrome.extension.getURL('kbm.html')}, 
                function(tab) {
                    alert(document.getElementById("loadall"));
                       document.getElementById("loadall").addEventListener("click",loadAll,false);
                });
        }
);

function loadAll(){
    alert("hallo");
}

加载kbm.html并单击工具栏图标后，我可以从chrome.tabs.create回调中看到警报消息。 但是单击loadall按钮没有任何效果。

我可以在调试器（使用f12）中看到页面加载后按钮上没有侦听器。

语法似乎还可以，因为我可以从js-console动态将侦听器添加到按钮

>document.getElementById("loadall").addEventListener("click",loadAll);
undefined

并且它出现在元素描述中，因此单击后我看到来自loadAll（）调用的警报。

首先，我认为mb回调是在所有页面元素初始化之前调用的，因此它无法找到id =“ loadall”的元素，而是根据带有消息的第一个警报

object HTMLButtonElement

那不是原因。

但是我仍然不明白为什么页面加载时没有回调附加到按钮:(

我看了一些例子，但是我不能盲目地复制自己的认识，我想找到我想念的东西。

提前致谢。

Answer 1

恩...我只是放弃了，将添加按钮侦听器逻辑移到了另一个地方：

document.addEventListener('DOMContentLoaded', function () {
    document.getElementById('loadall').addEventListener('click', loadAll)
}

无法在Chrome扩展程序中添加监听器

问题描述

1 个解决方案

解决方案1
1 2013-07-11 08:27:59

无法在Chrome扩展程序中添加监听器

问题描述

1 个解决方案

解决方案1 1 2013-07-11 08:27:59

解决方案1
1 2013-07-11 08:27:59