不能'在Chrome扩展中添加监听器 [英] cant' add listener in chrome extension

查看:683
本文介绍了不能'在Chrome扩展中添加监听器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图创建铬扩展名,但无法以正确的方式将侦听器连接到按钮。必须注意的是,我对js不是很熟悉,所以问题在于一些错误的概念或一些元素加载时机。

 background:{page:kbm.html} 

我使用清单v2,所以内联js不受欢迎,所以我试图在回调中添加监听器



这里是kbm.html:

 <!DOCTYPE html> 
< html>
< head>
< script src =kbm.js>< / script>
< / head>
< body>
< button id =loadall>打开所有已保存的< /按钮>
< / 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);
});
}
);

函数loadAll(){
alert(hallo);
}

加载kbm.html并点击工具栏图标后,我可以看到警报消息chrome.tabs.create回调。但是点击loadall按钮并没有提供任何东西。

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



语法似乎没问题,因为我可以动态地将监听器添加到js-console的按钮中

 >的document.getElementById( LOADALL)的addEventListener( 点击,LOADALL); 
undefined

它出现在元素描述中,所以我在loadAll点击。

首先我认为mb回调函数在所有页面元素初始化之前调用,因此它无法找到id =loadall的元素,但是按照第一个提示信息

  object HTMLButtonElement 

这不是理由。



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



我看过一些例子,但我不能盲目复制它的实现,我想找到我想要的东西。



提前致谢。

解决方案

呃...我刚刚放弃并将按钮侦听器逻辑添加到另一个地方:

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


I'am trying to create chromium extension, but can't attach listeners to buttons in correct way. It must be noticed that I'am not very familiar with js, so mb the problem is in some missunderstanding conception or some element loading timing.

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

I'am using manifest v2, so inline js is disalowed, so i'am trying to add listeners in callback

here is kbm.html:

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

and here is 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");
}

After loading kbm.html and clicking the toolbar icon I can see alert message from chrome.tabs.create callback. But click on loadall button gives nothing.

I can see in debugger(with f12) that there is no listener on the button after page loading.

The syntax is seems to be ok, because I can dynamically add listener to button from js-console

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

and it appears in element description so I see alert from loadAll() call after click.

First I thougth that mb callback is called previous to all pages elements initialization and thus it can't find element with id="loadall", but acording to first alert with message

object HTMLButtonElement 

that is not the reason.

But I still don't understand why there is no callback attached to button at page load:(

I'v looked at examples but I cant blindly copy ther realisation I want to find what am I missing.

Thanks in advance.

解决方案

Eh...I just gave up and moved add button listeners logic to another place like that:

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

这篇关于不能'在Chrome扩展中添加监听器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆