本节主要介绍如何在Google Chrome浏览器web页面上点击右键弹出自定义菜单，即如何使用谷歌Context Menus API接口。上节已经把主要流程介绍了，这节就直接上代码，代码都是官方例子没有实际意义，但是可以起到抛砖引玉的作用，大家根据自己的需要开发出自己想要的功能才是王道。

manifest.json代码如下：

{"name": "Context Menus Sample","description": "Shows some of the features of the Context Menus API","version": "0.6","permissions": ["contextMenus"],"background": {"scripts": ["sample.js"]},"manifest_version": 2}

 

sample.js代码如下：

// Copyright (c) 2010 The Chromium Authors. All rights reserved.  // Use of this source code is governed by a BSD-style license that can be  // found in the LICENSE file.    // A generic onclick callback function.  function genericOnClick(info, tab) {    console.log("item " + info.menuItemId + " was clicked");    console.log("info: " + JSON.stringify(info));    console.log("tab: " + JSON.stringify(tab));  }    // Create one test item for each context type.  var contexts = ["page","selection","link","editable","image","video",                  "audio"];  for (var i = 0; i < contexts.length; i++) {    var context = contexts[i];    var title = "Test '" + context + "' menu item";    var id = chrome.contextMenus.create({"title": title, "contexts":[context],                                         "onclick": genericOnClick});    console.log("'" + context + "' item:" + id);  }      // Create a parent item and two children.  var parent = chrome.contextMenus.create({"title": "Test parent item"});  var child1 = chrome.contextMenus.create(  {
    "title": "Child 1", "parentId": parent, "onclick": genericOnClick});  var child2 = chrome.contextMenus.create(    {
    "title": "Child 2", "parentId": parent, "onclick": genericOnClick});  console.log("parent:" + parent + " child1:" + child1 + " child2:" + child2);      // Create some radio items.  function radioOnClick(info, tab) {    console.log("radio item " + info.menuItemId +                " was clicked (previous checked state was "  +                info.wasChecked + ")");  }  var radio1 = chrome.contextMenus.create({"title": "Radio 1", "type": "radio",                                           "onclick":radioOnClick});  var radio2 = chrome.contextMenus.create({"title": "Radio 2", "type": "radio",                                           "onclick":radioOnClick});  console.log("radio1:" + radio1 + " radio2:" + radio2);      // Create some checkbox items.  function checkboxOnClick(info, tab) {    console.log(JSON.stringify(info));    console.log("checkbox item " + info.menuItemId +                " was clicked, state is now: " + info.checked +                "(previous state was " + info.wasChecked + ")");    }  var checkbox1 = chrome.contextMenus.create(    {
    "title": "Checkbox1", "type": "checkbox", "onclick":checkboxOnClick});  var checkbox2 = chrome.contextMenus.create(    {
    "title": "Checkbox2", "type": "checkbox", "onclick":checkboxOnClick});  console.log("checkbox1:" + checkbox1 + " checkbox2:" + checkbox2);      // Intentionally create an invalid item, to show off error checking in the  // create callback.  console.log("About to try creating an invalid item - an error about " +              "item 999 should show up");  chrome.contextMenus.create({
    "title": "Oops", "parentId":999}, function() {    if (chrome.extension.lastError) {      console.log("Got expected error: " + chrome.extension.lastError.message);    }  });

 

插件加载流程参考：http://blog.csdn.net/anda0109/article/details/50325849