1

私は JavaScript と Google Chrome のプラグイン開発の初心者です。最初の拡張機能を作成しようとしています。私の目的は、クリックごとに単純な JS アラートを表示するウィキペディア ページにページ アクションを設定することです。以下にリストされている私のコード：

// manifest.json
{
    "name": "My Plugin",
    "version": "0.0.1",
    "manifest_version": 2,

    "description": "My first expirience in plugin development for Google Chrome browser",

    "page_action": {
        "default_icon": "icon.png",
        "default_title": "Action Title"
    },

    "background": { 
        "scripts": ["background.js"] 
    },

    "permissions": [
        "tabs"
    ]
}

// background.js
// Listen for any changes to the URL of any tab.
chrome.tabs.onUpdated.addListener(checkForValidUrl);

// Called when the url of a tab changes.
function checkForValidUrl(tabId, changeInfo, tab) {
  // Show action only for wikipedia pages
  var regex = /wikipedia.org/gi;
  if (tab.url.match(regex)) { 
    chrome.pageAction.show(tabId);
    chrome.pageAction.onClicked.addListener(onClickListener);
  }
};

function onClickListener(tab) {
    alert('Clicked!!!');
}

問題は、アラートが画面に複数回表示されることです。また、ページをリロードするたびに、2 回以上表示されます。例えば：

  • ページを開く
  • 私のプラグインアイコンをクリック
  • アラートが 2 回表示される
  • 次のページへ
  • アイコンをクリック
  • アラートが 4 回表示される

等々...

しかし、クリックごとに1回だけアラートを表示したい。私は何を間違っていますか？

4

1 に答える 1

1

ドキュメントが読み込まれるときに、最初にリスナーを追加できます。DOMContentLoaded イベントが発生した後にリスナーを追加する必要があります。

document.addEventListener('DOMContentLoaded', function() {
    chrome.tabs.onUpdated.addListener(checkForValidUrl);
    //chrome.pageAction.onClicked.addListener(onClickListener); //might need to put this here, it's been a while since I've done a chrome extension, but if you do then just put your conditional for the regex in your onClickListener function
});

    // Called when the url of a tab changes.
function checkForValidUrl(tabId, changeInfo, tab) {
  // Show action only for wikipedia pages
  var regex = /wikipedia.org/gi;
  if (tab.url.match(regex)) { 
    chrome.pageAction.show(tabId);
    chrome.pageAction.onClicked.addListener(onClickListener);
  }
};

function onClickListener(tab) {
    alert('Clicked!!!');
}
于 2012-10-16T14:40:14.243 に答える