Utilisation de jQuery dans la page d'arrière-plan de l'extension chrome

Objectif

Je suis en train d'utiliser ce code réutilisable pour rechercher l'aide d'un dictionnaire de l'API en ligne pour trouver le mot sélectionné et retourner la définition.

Problème

J'ai testé le réel ajax de jQuery appeler séparément et il fonctionne bien. Aussi, je peux obtenir le mot sélectionné dans la page. Cependant, pour une raison que je vais avoir des problèmes en fait appel l'ajax fonction dans mon code réutilisable dans Sample.js

Conseil est nécessaire.

background.html

<html>

  <script src="jquery.js"/>
  <script src="sample.js"/>

  <body>
    <p>
    Image here:
    </p>

    <img id="target" src="white.png" width="640" height="480">

  </body>
</html>

Manifeste.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"],
    "pages": ["background.html"]
  },
  "manifest_version": 2
}

Sample.js

     //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));
alert(info.selectionText);
displayText(info.selectionText);
console.log("asfasdf");
$("#testID", document).html("testing jQuery");
$.ajax({
url: "http://api.wordnik.com//v4/word.json/cat/definitions?api_key=mykey&includeRelated=false&includeTags=false&limit=1",
dataType : 'json',
success: function(data) {
//called when successful
alert(data[0].word);
},
error: function(e) {
//called when there is an error
console.log(e.message);
}
});
}
//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);
}
});

source d'informationauteur Spencer Allen Gardner