0

クロム拡張機能を作成しようとしていますが、リスナーをボタンに正しく接続できません。私は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 に答える