右クリックにメニューを表示し、クリックするとアクティブタブのタイトルとURLを新しいタブ(ローカルhtml)に渡すサンプル。
フォルダには下記4つのファイルとjquery-3.5.0.min.jsを入れてある。
manifest.json
|
1 2 3 4 5 6 7 8 9 10 |
{ "manifest_version": 2, "name": "右クリック", "description": "", "version": "1.0", "background" : { "scripts" : ["background.js"] }, "permissions" : ["contextMenus","tabs","storage"] } |
background.js
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
chrome.contextMenus.create({ "title" : "Bookmark", "type" : "normal", "contexts" : ["page"], "onclick" : () => { chrome.tabs.getSelected((currentTab) => { let values = { 'title':currentTab.title, 'url':currentTab.url }; chrome.storage.sync.set(values, null); chrome.tabs.create({url: "test.html"}, null); }); } }); |
test.html
|
1 2 3 |
<p id="msg"></p> <script src="jquery-3.5.0.min.js"></script> <script src="test.js"></script> |
test.js
|
1 2 3 4 5 6 |
$(window).on('load',function(){ chrome.storage.sync.get(['title', 'url'], (items) => { alert(items.title); $("#msg").text(items.url); }); }); |