omnibox.onInputEntered

当用户从您的扩展添加到地址栏下拉列表中的建议中选择一个时触发。

使用此事件处理用户的选择,通常是打开相应的页面。事件侦听器将传递

  • 用户的选择
  • a omnibox.OnInputEnteredDisposition: 使用它来确定是在当前标签页中打开新页面,还是在新前台标签页中打开,或者在新后台标签页中打开。

语法

js
browser.omnibox.onInputEntered.addListener(listener)
browser.omnibox.onInputEntered.removeListener(listener)
browser.omnibox.onInputEntered.hasListener(listener)

事件具有三个函数

addListener(listener)

向此事件添加侦听器。

removeListener(listener)

停止侦听此事件。listener 参数是要删除的侦听器。

hasListener(listener)

检查 listener 是否为该事件注册。如果正在侦听,则返回 true,否则返回 false

addListener 语法

侦听器函数将传递两个参数:一个字符串 text 和一个 omnibox.OnInputEnteredDisposition

参数

text

String。这是用户选择的 omnibox.SuggestResult 对象的 content 属性的值。

disposition

OnInputEnteredDisposition。一个 omnibox.OnInputEnteredDisposition 枚举,指示扩展程序应在当前标签页中打开页面,还是在新前台标签页中打开,或者在新后台标签页中打开。

浏览器兼容性

BCD 表格仅在浏览器中加载

示例

此示例将用户的输入解释为 CSS 属性名称,并使用一个 omnibox.SuggestResult 对象为与输入匹配的每个 CSS 属性填充下拉列表。SuggestResultdescription 属性是属性的完整名称,content 是该属性的 MDN 页面。

该示例还侦听 omnibox.onInputEntered,并根据 omnibox.OnInputEnteredDisposition 参数打开与选择相对应的 MDN 页面。

js
browser.omnibox.setDefaultSuggestion({
  description: "Type the name of a CSS property",
});

/*
Very short list of a few CSS properties.
*/
const props = [
  "animation",
  "background",
  "border",
  "box-shadow",
  "color",
  "display",
  "flex",
  "flex",
  "float",
  "font",
  "grid",
  "margin",
  "opacity",
  "overflow",
  "padding",
  "position",
  "transform",
  "transition",
];

const baseURL = "https://mdn.org.cn/en-US/docs/Web/CSS/";

/*
Return an array of SuggestResult objects,
one for each CSS property that matches the user's input.
*/
function getMatchingProperties(input) {
  const result = [];
  for (const prop of props) {
    if (prop.startsWith(input)) {
      console.log(prop);
      const suggestion = {
        content: `${baseURL}${prop}`,
        description: prop,
      };
      result.push(suggestion);
    } else if (result.length !== 0) {
      return result;
    }
  }
  return result;
}

browser.omnibox.onInputChanged.addListener((input, suggest) => {
  suggest(getMatchingProperties(input));
});

browser.omnibox.onInputEntered.addListener((url, disposition) => {
  switch (disposition) {
    case "currentTab":
      browser.tabs.update({ url });
      break;
    case "newForegroundTab":
      browser.tabs.create({ url });
      break;
    case "newBackgroundTab":
      browser.tabs.create({ url, active: false });
      break;
  }
});

示例扩展

注意:此 API 基于 Chromium 的 chrome.omnibox API。