omnibox.onInputEntered

当用户选择了你的扩展程序添加到地址栏下拉列表中的某个建议项时触发。

使用此事件来处理用户的选择,通常是打开相应的页面。事件监听器将接收

  • 用户的选择
  • 一个 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

参数

文本

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

disposition

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

示例

此示例将用户的输入解释为 CSS 属性名称,并为每个匹配输入的 CSS 属性在下拉列表中填充一个 omnibox.SuggestResult 对象。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。