動作是指使用者點選工具列圖示時發生的情況,通常稱為擴充功能的動作圖示。動作會使用 Action API 叫用擴充功能,或開啟快顯視窗。本頁說明如何叫用擴充功能。如要使用彈出式視窗,請參閱「新增彈出式視窗」。
註冊動作
如要使用 browser.action API,請將 "action" 金鑰新增至擴充功能的資訊清單檔案。如要完整瞭解這個欄位的選用屬性,請參閱 browser.action API 參考資料的資訊清單部分。
manifest.json:
{
"name": "My Awesome action Extension",
...
"action": {
...
}
...
}
回應動作
註冊 onClicked 處理常式,以便在使用者點選動作圖示時執行操作。如果在 manifest.json 檔案中註冊彈出式視窗,系統就不會觸發這個事件。
service-worker.js:
browser.action.onClicked.addListener((tab) => {
browser.action.setTitle({
tabId: tab.id,
title: `You are on tab: ${tab.id}`});
});
有條件地啟動動作
透過 browser.declarativeContent API,您可以根據網頁網址或 CSS 選取器是否與網頁上的元素相符,啟用擴充功能的動作圖示。如果擴充功能的操作圖示已停用,圖示會顯示為灰色。如果使用者點選已停用的圖示,系統會顯示擴充功能的內容選單。
動作徽章
徽章是格式化文字片段,會放在動作圖示上方,用來表示擴充功能狀態或使用者必須執行的動作等。為說明這點,「Drink Water」範例會顯示「開啟」徽章,讓使用者知道自己已成功設定鬧鐘,並在擴充功能閒置時不顯示任何內容。徽章最多可包含四個字元。
呼叫 browser.action.setBadgeText() 即可設定徽章文字,呼叫 browser.action.setBadgeBackgroundColor() 即可設定背景顏色。
service-worker.js:
browser.action.setBadgeText({text: 'ON'});
browser.action.setBadgeBackgroundColor({color: '#4688F1'});
工具提示
在 manifest.json 檔案的 "action" 鍵下,於 "default_title" 欄位中註冊工具提示。
manifest.json:
{
"name": "Tab Flipper",
...
"action": {
"default_title": "Press Ctrl(Win)/Command(Mac)+Shift+Right/Left to flip tabs"
}
...
}
您也可以呼叫 action.setTitle() 來設定或更新工具提示。如未設定工具提示,系統會顯示擴充功能的名稱。