添加菜单项

学习本章前，您要先安装SDK 和学习 cfx的基本用法

用右键菜单模块添加右键菜单项或子菜单

下面的例子是增加了一个新的上下文菜单项。当页面被选中时才会显示该菜单项，选择的部分会被发送到main.js的add-on代码中，它只是记录：

var contextMenu = require("sdk/context-menu");
 var menuItem = contextMenu.Item({
  label: "Log Selection",
  context: contextMenu.SelectionContext(),
  contentScript: 'self.on("click", function () {' +
                 '  var text = window.getSelection().toString();' +
                 '  self.postMessage(text);' +
                 '});',
  onMessage: function (selectionText) {
    console.log(selectionText);
  }
});

Try it: run the add-on, load a web page, select some text and right-click. You should see the new item appear:

试一试：运行该扩展，加载一个网页，选中一些文本并右键单击。你应该能看到新的项目出现：

点击，选中的文本记录到控制台:

info: elephantine lizard

细节

这个add-on所有的操作是构建一个上下文菜单项。你不需要添加它：一旦你已经建立了项目，它会自动添加在正确的上下文。在这种情况下，构造函数接受四个选项：label，context，和contentscript，onMessage。

label

标签是字符串的显示。

context

上下文应该在不同的情境中显示它该做的显示。上下文菜单模块提供了一些简单的内置的上下文，包括selectioncontext()，这意味着：当页面被选中的时候将会显示菜单项。
如果这些简单的背景是不够的，你可以使用脚本定义更复杂的环境。

contentScript

这将一个脚本项目。在这种情况下，脚本侦听用户点击该项目，然后选定文本用消息发送到add-on。

onMessage

onMessage属性提供附加的代码来响应来自连接到上下文菜单项脚本报文的一种方法。在这种情况下，它只是记录选定的文本。

所以：
用户点击项目
内容脚本的点击事件触发，和内容脚本检索选定的文本和发送邮件的附件
附加的消息事件触发，并附加代码的处理函数是通过选定的文本，它的日志

获取更多

如果想获取更多信息关于context-menu模块，查看context-menu API reference.