jQuery wykorzystanie w tle strony chrome rozszerzenia

wybijajQuery wykorzystanie w tle strony chrome rozszerzenia

Próbuję użyć tego kodu szablonowe zajrzeć do słownika za pomocą API online, aby znaleźć wybrane słowo i zwrócić definicji.

Problem

Ja testowałem rzeczywiste jQuery wywołanie ajax osobno i działa dobrze. Ponadto mogę uzyskać wybrane słowo na stronie. Jednak z jakiegoś powodu mam problemy faktycznie wywoływanie funkcji ajax w ramach mojego kodu standardowego w Sample.js

Porada jest potrzebna.

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>

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"], 
    "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); 
    } 
});

Źródło

2012-11-10 Spencer Allen Gardner

Trzeba dodać p ermission dla url której dzwonisz w funkcji ajax do manifestu:

"permissions": [ 
    "contextMenus", 
    "http://api.wordnik.com/*" 
    ],

Nie zapomnij podać jQuery:

"background": { "scripts": ["jquery.js", "sample.js"], "pages": ["background.html"] }

i nie trzeba <script src="jquery.js"/> w pliku

Link do strony internetowej powinien mieć/* na końcu.

Źródło

2012-11-10 08:01:09

To nadal nie działa - z jakiegoś powodu nie sądzę, że mój jQuery w ogóle działa ... Czy ktoś może coś zobaczyć? –

Zaktualizowałem moją odpowiedź. Zapomniałeś włączyć jquery do właściwości 'scripts'! –

Rozumiem. Już działa. Trochę debugowałem - próbowałem bez problemu debugować z konsoli strony, ale zdałem sobie sprawę, że muszę sprawdzić konsolę _generated_background_page.html, aby sprawdzić błędy. –

jQuery wykorzystanie w tle strony chrome rozszerzenia

Odpowiedz

Powiązane problemy