0

我正在尝试创建 chromium 扩展，但无法以正确的方式将侦听器附加到按钮。需要注意的是，我对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

这不是原因。

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

我查看了示例，但我不能盲目地复制他们的实现，我想找到我缺少的东西。

提前致谢。

4

1 回答 1

1

嗯...我刚刚放弃并将添加按钮侦听器逻辑移到另一个地方，如下所示：

document.addEventListener('DOMContentLoaded', function () {
    document.getElementById('loadall').addEventListener('click', loadAll)
}
于 2013-07-11T08:27:59.800 回答