2017-03-18 103 views
0

我將jquery作爲腳本加載到清單中,不再發生加載錯誤。但是,每當我跑我的Chrome擴展程序,我得到一個錯誤說未捕獲的ReferenceError:$沒有在popup.js定義:15未在Chrome擴展中定義的jquery

popup.js

var url = 'http://api.petfinder.com/pet.getRandom?key=fe1c3608eef3a014392be43230072267&shelterid=KY305&output=full&format=json'; 
$.ajax({ 
    type : 'GET', 
    data : {}, 
    url : url+'&callback=?' , 
    dataType: 'json', 
    success : function(data) {    
     var result = ''; 
     var petfinder = data.petfinder; 
     var infoHTML = '<ul>'; 
     infoHTML += '<li>'; 
     infoHTML += '<strong>Description</strong><br>'; 
     infoHTML += petfinder.pet.description['$t']; 
     infoHTML += '</li>'; 
     infoHTML += '</li>'; 
     infoHTML += '</ul>'; 
     // return infoHTML; 
     $('#petfinderInfo').html(infoHTML); 
     // $('#petfinderInfo').html(petfinder.pet.description['$t']); 
     console.log(petfinder); 
    } 
}); 

popup.html

<!doctype html> 
<html> 
<head> 
<title>Local Adoptable Pets</title> 
<style> 
    body { 
    font-family: "Segoe UI", "Lucida Grande", Tahoma, sans-serif; 
    font-size: 100%; 
    /* avoid an excessively wide status text */ 
    white-space: pre; 
    /*text-overflow: ellipsis;*/ 
    overflow: auto; 
    width: 350px; 
    max-width: 500px; 
    } 
</style> 

<script src="popup.js"></script> 
<script src="jquery.min.js"></script> 
</head> 
<body> 
    Local Adoptable Pets: 
</body> 
</html> 

的manifest.json

{ 
"manifest_version": 2, 
"name": "Getting started example", 
"description": "This extension shows a Google Image search result for the current page", 
"version": "0.1.0", 

"browser_action": { 
"default_icon": "icon.png", 
"default_popup": "popup.html", 
"default_title": "Adopt!" 
}, 

"content_scripts": [{ 
"matches": ["http://*/*","https://*/*"], 
"js": [ 
    "jquery.min.js", 
    "popup.js" 
] 
}], 

"permissions": [ 
"activeTab", 
"https://ajax.googleapis.com/" 
] 
} 

回答

3

開關這兩條線

<script src="popup.js"></script> 
<script src="jquery.min.js"></script> 

你以後加載的jQuery的順序,以$未在規定時間。

4

你必須把
<script src="jquery.min.js"></script>

<script src="popup.js"></script>

因此最終的HTML代碼將是

<!doctype html> 
<html> 
<head> 
<title>Local Adoptable Pets</title> 
<style> 
    body { 
    font-family: "Segoe UI", "Lucida Grande", Tahoma, sans-serif; 
    font-size: 100%; 
    /* avoid an excessively wide status text */ 
    white-space: pre; 
    /*text-overflow: ellipsis;*/ 
    overflow: auto; 
    width: 350px; 
    max-width: 500px; 
    } 
</style> 

<script src="jquery.min.js"></script> 
<script src="popup.js"></script> 
</head> 
<body> 
    Local Adoptable Pets: 
</body> 
</html>