Opis
Użyj interfejsu chrome.contextMenus
API, aby dodać elementy do menu kontekstowego Google Chrome. Możesz wybrać typy obiektów, do których mają być stosowane dodatki do menu kontekstowego, np. obrazy, hiperlinki i strony.
Uprawnienia
contextMenus
Aby korzystać z interfejsu API, musisz zadeklarować uprawnienie "contextMenus"
w pliku manifestu rozszerzenia. Musisz też podać ikonę o wymiarach 16 x 16 pikseli, która będzie wyświetlana obok elementu menu. Na przykład:
{
"name": "My extension",
...
"permissions": [
"contextMenus"
],
"icons": {
"16": "icon-bitty.png",
"48": "icon-small.png",
"128": "icon-large.png"
},
...
}
Pojęcia i zastosowanie
Elementy menu kontekstowego mogą pojawiać się w dowolnym dokumencie (lub ramce w dokumencie), nawet w tych z adresami URL file:// lub chrome://. Aby określić, w których dokumentach mogą się pojawiać Twoje elementy, podczas wywoływania metod create()
lub update()
podaj pole documentUrlPatterns
.
Możesz utworzyć dowolną liczbę elementów menu kontekstowego, ale jeśli jednocześnie widocznych jest więcej niż jeden element z Twojego rozszerzenia, Google Chrome automatycznie zwija je do jednego menu nadrzędnego.
Przykłady
Aby wypróbować ten interfejs API, zainstaluj przykład interfejsu API contextMenus z repozytorium chrome-extension-samples.
Typy
ContextType
Różne konteksty, w których może pojawić się menu. Określenie „all” jest równoznaczne z połączeniem wszystkich innych kontekstów z wyjątkiem „launcher”. Kontekst „launcher” jest obsługiwany tylko przez aplikacje i służy do dodawania elementów menu do menu kontekstowego, które pojawia się po kliknięciu ikony aplikacji w programie uruchamiającym, na pasku zadań, w docku itp. Różne platformy mogą nakładać ograniczenia na to, co jest faktycznie obsługiwane w menu kontekstowym programu uruchamiającego.
Typ wyliczeniowy
„all”
„page”
„frame”
„selection”
„link”
„editable”
„image”
„video”
„audio”
„launcher”
"browser_action"
„page_action”
„action”
CreateProperties
Właściwości nowego elementu menu kontekstowego.
Właściwości
-
zaznaczono
wartość logiczna opcjonalna
Stan początkowy pola wyboru lub przycisku:
true
– zaznaczony,false
– odznaczony. W danej grupie można wybrać tylko jedną opcję. -
konteksty,
[ContextType, ...ContextType[]] opcjonalnie
Lista kontekstów, w których będzie wyświetlana ta pozycja menu. Domyślna wartość to
['page']
. -
documentUrlPatterns
string[] opcjonalne
Ogranicza element tak, aby był stosowany tylko do dokumentów lub ramek, których adres URL pasuje do jednego z podanych wzorców. Szczegółowe informacje o formatach wzorców znajdziesz w artykule Wzorce dopasowania.
-
włączone
wartość logiczna opcjonalna
Czy ta pozycja menu kontekstowego jest włączona czy wyłączona. Domyślna wartość to
true
. -
id
string opcjonalny
Unikalny identyfikator, który ma zostać przypisany do tego elementu. Obowiązkowe w przypadku stron wydarzeń. Nie może być taki sam jak inny identyfikator tego rozszerzenia.
-
parentId
string | number opcjonalnie
Identyfikator elementu menu nadrzędnego. Dzięki temu element staje się elementem podrzędnym wcześniej dodanego elementu.
-
targetUrlPatterns
string[] opcjonalne
Podobnie jak w przypadku
documentUrlPatterns
, filtry oparte na atrybuciesrc
tagówimg
,audio
ivideo
oraz atrybuciehref
tagówa
. -
tytuł
string opcjonalny
Tekst wyświetlany w elemencie. Jest on wymagany, chyba że
type
ma wartośćseparator
. Gdy kontekst toselection
, użyj w ciągu znaków symbolu%s
, aby wyświetlić zaznaczony tekst. Jeśli na przykład wartość tego parametru to „Przetłumacz „%s” na język Pig Latin”, a użytkownik wybierze słowo „cool”, element menu kontekstowego dla tego wyboru będzie brzmiał „Przetłumacz „cool” na język Pig Latin”. -
typ
ItemType opcjonalny
Typ elementu menu. Domyślna wartość to
normal
. -
widoczna
wartość logiczna opcjonalna
Określa, czy element jest widoczny w menu.
-
onclick
void optional
Funkcja, która jest wywoływana po kliknięciu elementu menu. Nie jest to dostępne w skrypcie service worker. Zamiast tego zarejestruj odbiornik dla zdarzenia
contextMenus.onClicked
.Funkcja
onclick
wygląda tak:(info: OnClickData, tab: Tab) => {...}
-
informacje
Informacje o klikniętym elemencie i kontekście, w którym nastąpiło kliknięcie.
-
tabulator
Szczegóły karty, na której nastąpiło kliknięcie. Ten parametr nie występuje w przypadku aplikacji platformowych.
-
ItemType
Typ elementu menu.
Typ wyliczeniowy
„normal”
„checkbox”
„radio”
"separator"
OnClickData
Informacje wysyłane po kliknięciu elementu menu kontekstowego.
Właściwości
-
zaznaczono
wartość logiczna opcjonalna
Flaga wskazująca stan pola wyboru lub opcji po kliknięciu.
-
edytowalny,
Wartość logiczna
Flaga wskazująca, czy element można edytować (pole tekstowe, obszar tekstowy itp.).
-
frameId
number opcjonalny
Chrome 51 lub nowszaIdentyfikator ramki elementu, w którym kliknięto menu kontekstowe, jeśli znajdował się w ramce.
-
frameUrl
string opcjonalny
Adres URL ramki elementu, w którym kliknięto menu kontekstowe (jeśli element znajdował się w ramce).
-
linkUrl
string opcjonalny
Jeśli element jest linkiem, jest to adres URL, do którego prowadzi.
-
mediaType
string opcjonalny
Wartość „image”, „video” lub „audio”, jeśli menu kontekstowe zostało aktywowane na jednym z tych typów elementów.
-
ciąg znaków | liczba
Identyfikator klikniętego elementu menu.
-
pageUrl
string opcjonalny
Adres URL strony, na której kliknięto element menu. Ta właściwość nie jest ustawiana, jeśli kliknięcie nastąpiło w kontekście, w którym nie ma bieżącej strony, np. w menu kontekstowym programu uruchamiającego.
-
parentMenuItemId
string | number opcjonalnie
Identyfikator nadrzędny klikniętego elementu (jeśli występuje).
-
selectionText
string opcjonalny
Tekst wybranego kontekstu (jeśli występuje).
-
srcUrl
string opcjonalny
Będzie obecny w przypadku elementów z adresem URL „src”.
-
wasChecked
wartość logiczna opcjonalna
Flaga wskazująca stan pola wyboru lub opcji przed kliknięciem.
Właściwości
ACTION_MENU_TOP_LEVEL_LIMIT
Maksymalna liczba elementów rozszerzenia najwyższego poziomu, które można dodać do menu kontekstowego działania związanego z rozszerzeniem. Wszystkie elementy powyżej tego limitu będą ignorowane.
Wartość
6
Metody
create()
chrome.contextMenus.create(
createProperties: CreateProperties,
callback?: function,
): number | string
Tworzy nowy element menu kontekstowego. Jeśli podczas tworzenia wystąpi błąd, może on zostać wykryty dopiero po wywołaniu zwrotnej funkcji tworzenia. Szczegóły znajdziesz w runtime.lastError
.
Parametry
-
createProperties
-
callback
funkcja opcjonalna
Parametr
callback
wygląda tak:() => void
Zwroty
-
liczba | ciąg tekstowy
Identyfikator nowo utworzonego elementu.
remove()
chrome.contextMenus.remove(
menuItemId: string | number,
): Promise<void>
Usuwa element menu kontekstowego.
Parametry
-
ciąg znaków | liczba
Identyfikator elementu menu kontekstowego do usunięcia.
Zwroty
-
Promise<void>
Chrome 123 lub nowsza
removeAll()
chrome.contextMenus.removeAll(): Promise<void>
Usuwa wszystkie elementy menu kontekstowego dodane przez to rozszerzenie.
Zwroty
-
Promise<void>
Chrome 123 lub nowsza
update()
chrome.contextMenus.update(
id: string | number,
updateProperties: object,
): Promise<void>
Aktualizuje utworzony wcześniej element menu kontekstowego.
Parametry
-
id
ciąg znaków | liczba
Identyfikator elementu do zaktualizowania.
-
updateProperties
obiekt
Właściwości do zaktualizowania. Akceptuje te same wartości co funkcja
contextMenus.create
.-
zaznaczono
wartość logiczna opcjonalna
-
konteksty,
[ContextType, ...ContextType[]] opcjonalnie
-
documentUrlPatterns
string[] opcjonalne
-
włączone
wartość logiczna opcjonalna
-
parentId
string | number opcjonalnie
Identyfikator elementu, który ma stać się elementem nadrzędnym tego elementu. Uwaga: nie możesz ustawić elementu jako podrzędnego względem jego własnego elementu potomnego.
-
targetUrlPatterns
string[] opcjonalne
-
tytuł
string opcjonalny
-
typ
ItemType opcjonalny
-
widoczna
wartość logiczna opcjonalna
Chrome 62 lub nowszaOkreśla, czy element jest widoczny w menu.
-
onclick
void optional
Funkcja
onclick
wygląda tak:(info: OnClickData, tab: Tab) => {...}
-
informacjeChrome 44 lub nowszy
-
tabulatorChrome 44 lub nowszy
Szczegóły karty, na której nastąpiło kliknięcie. Ten parametr nie występuje w przypadku aplikacji platformowych.
-
-
Zwroty
-
Promise<void>
Chrome 123 lub nowsza
Wydarzenia
onClicked
chrome.contextMenus.onClicked.addListener(
callback: function,
)
Uruchamiane po kliknięciu elementu menu kontekstowego.
Parametry
-
callback
funkcja
Parametr
callback
wygląda tak:(info: OnClickData, tab?: tabs.Tab) => void
-
informacje
-
tabulator
tabs.Tab opcjonalne
-