Question

我需要显示多个浏览器按钮。在阅读文档以及有关堆栈溢出的一些问题后 - 我发现Cross Rider每个扩展只支持一个浏览器按钮。

我可以在浏览器中显示一些菜单（我不愿意使用上下文菜单），一旦用户点击交叉滚动浏览器按钮就会触发该菜单吗？如果是这样，我如何使用jquery处理任何菜单项上的click事件？

我非常感谢在这方面的任何支持/出路。

Answer 1

根据经验，我经常看到开发人员在使用Crossrider的appAPI.brwoserAction.setPopup方法单击按钮时打开的浏览器操作弹出窗口中创建这样的菜单。以下简单示例显示如何创建打开不同搜索引擎的菜单：

background.js 文件中的代码：

appAPI.ready(function() {
    // Set the button to use icon from resources
    appAPI.browserAction.setResourceIcon('icon.png');
    // Sets the resource path for the popup
    appAPI.browserAction.setPopup({
        resourcePath:'popup.html',
        height: 300,
        width: 300
    });
});

popup.html 资源文件中的代码：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<script type="text/javascript">
function crossriderMain($) {
  $('#link-google')
    .click(function() {
      appAPI.openURL({
        url:'http://www.google.com',
        where:'tab'
      });
    });
  $('#link-bing')
    .click(function() {
      appAPI.openURL({
        url:'http://www.bing.com',
        where:'tab'
      });
    });
  $('#link-yahoo')
    .click(function() {
      appAPI.openURL({
        url:'http://www.yahoo.com',
        where:'tab'
      });
    });
}
</script>
</head>
<body>
<ul>
  <li><a href='#' id='link-google'>Goto Google Search</a></li>
  <li><a href='#' id='link-bing'>Goto Bing Search</a></li>
  <li><a href='#' id='link-yahoo'>Goto Yahoo Search</a></li>
</ul>
</body>
</html>

[披露：我是Crossrider员工]

Crossrider：如何使用crossrider显示多个浏览器按钮或包含多个项目的菜单？

1 个答案: