یک منوی زمینه بسازید، یک منوی زمینه بسازید

یک منوی زمینه برای کلیک جایگزین (که اغلب کلیک راست نامیده می‌شود) ماوس ظاهر می‌شود. این صفحه نحوه پیاده‌سازی یک منوی زمینه را شرح می‌دهد. برای لیست کاملی از اعضای API مرتبط، به browser.contextMenu مراجعه کنید.

برای ساخت یک منوی زمینه، ابتدا مجوز "contextMenus" را به فایل manifest.json اضافه کنید.

مانیفست.json:

  "permissions": [
    "contextMenus"
  ],

در صورت تمایل، اگر می‌خواهید یک آیکون در کنار یک آیتم منو نمایش داده شود، از کلید "icons" استفاده کنید. در این مثال، آیتم منو برای افزونه "Global Google Search" از یک آیکون ۱۶ در ۱۶ استفاده می‌کند.

یک آیتم منوی زمینه با آیکون ۱۶ در ۱۶.
یک آیتم منوی زمینه با آیکون ۱۶ در ۱۶.

بقیه این مثال از نمونه منوی زمینه جستجوی جهانی گوگل گرفته شده است که گزینه‌های متعددی برای منوی زمینه ارائه می‌دهد. وقتی یک افزونه شامل بیش از یک منوی زمینه باشد، کروم به طور خودکار آنها را در یک منوی والد واحد، همانطور که در اینجا نشان داده شده است، قرار می‌دهد:

یک منوی زمینه تو در تو.
شکل ۴ : یک منوی زمینه و یک زیرمنوی تو در تو.

این نمونه با فراخوانی تابع contextMenus.create() در سرویس دهنده افزونه ، این موضوع را نشان می‌دهد. آیتم‌های زیرمنو از فایل locales.js وارد می‌شوند. سپس runtime.onInstalled روی آنها تکرار می‌کند.

سرویس-ورکر.js:

const tldLocales = {
  'com.au': 'Australia',
  'com.br': 'Brazil',
  ...
}

browser.runtime.onInstalled.addListener(async () => {
  for (let [tld, locale] of Object.entries(tldLocales)) {
    browser.contextMenus.create({
      id: tld,
      title: locale,
      type: 'normal',
      contexts: ['selection'],
    });
  }
});