2011-01-12 6 views
7

アドレスバーにアイコンとして表示されるChrome拡張機能を作成しようとしています。クリックすると、ページのすべての要素にcontenteditable = trueが設定され、再度クリックするとcontenteditable = falseに戻ります。Chrome拡張機能PageActionアイコンをアドレスバーに表示するにはどうすればよいですか?

しかし、私は最初のハードルに落ちています...アイコンはアドレスバーにも表示されません。

ここに私のマニフェスト・ファイルです:

{ 
    "name": "Caret", 
    "version": "1.0", 
    "description": "Allows you to edit the content on any webpage", 
    "page_action": { 
    "default_icon": "icon.png" 
    }, 
    "content_scripts": [ 
    { 
     "matches": ["http://*/*"], 
     "js": ["jquery.js", "caret.js"] 
    } 
    ], 
    "permissions" : [ 
    "tabs" 
    ] 
} 

、ここではcaret.jsスクリプトです:

chrome.browserAction.onClicked.addListener(function(Tab) { 

    $("*").attr("contenteditable",true); 

}); 

これは拡張子での私の最初の試みであるので、それは非常におそらく初心者の間違いだが、私は助けやアドバイスを本当に感謝しています!

+0

これは、Chromeで変更することはできなくなりました。 ropstahの答えは正しいとマークする必要があります。 –

答えて

16

[OK]を、私は達成された現在のタブのIDを取得するために必要なものでこれ、私がchrome.pageAction.show(tab.id);を使用する必要が判明:

chrome.tabs.getSelected(null, function(tab) { 

    chrome.pageAction.show(tab.id); 


}); 

しかしそれはあなたが使用することはできません判明コンテンツスクリプト内にchrome.tabsがあるので、代わりにバックグラウンドページを使用する必要がありました。

+0

たとえば、このJSONをマニフェストファイルに追加できます。 "背景": { "スクリプト":[ "my_background_script.js"]} はその後my_background_script.jsでページのアイコンを表示するJavaScriptを置きます。 – devdanke

+0

そこにも素晴らしい答えがあります:http://stackoverflow.com/a/12574427/1030960 – Anto

+1

@Chris Armstrong私はページアクションのアイコンを取得できませんでした。 –

3

My answer to this other questionが得られる。参考までに、その答えに書かれている2番目のコードの問題もあなたのコードに関連しています。アイコンをすべてのページに表示したいので、page_actionではなくbrowser_actionを使用してください。いずれも機能しますが、すべてのページでページアクションを使用すると、規約に反するため、一貫性の低いエンドユーザーエクスペリエンスが向上します。

0

私はこれでした:ここで、私は同様の問題があった

chrome.tabs.onUpdated.addListener(function(id, info, tab){ 
    if (tab.url.toLowerCase().indexOf("contratado.me") > -1){ 
    chrome.pageAction.show(tab.id); 
    } 
}); 
1

を、私はそれを解決するために、その後の手順です:

私は、以下を含むために私manifest.jsonを変更:

{ 
    "background": { 
    "scripts": ["background.js"], 
    "persistent":false 
    }, 
    "page_action": { 
    "default_icon": "logo.png", 
    "default_title": "onhover title", 
    "default_popup": "popup.html" 
    } 
} 

次に、私のバックグラウンドスクリプトに次のコードを挿入しました:

このためドキュメントはここで見つけることができます

... https://developer.chrome.com/extensions/declarativeContent

関連する問題