using jquery in chrome extension
Question
the chrome extension i am building gets the selected text from the tab open when the user clicks on the select button in popup.I am trying to use jquery for this.
Manifest.json
{
"manifest_version": 2,
"name": "cap",
"description": "BLAH",
"version": "1.0",
"permissions": [ "tabs",
"https://*/*","http://*/*"
],
"content_scripts": [
{
"matches": ["http://*/*","https://*/*"],
"js": ["selection.js"],
"run_at": "document_start",
"all_frames": true
}
],
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup_main.html"
}
}
I have included the jquery script in popup.html
<html><head>
<meta charset="utf-8">
<title>popup</title>
<link rel="stylesheet" href="/popup.css">
<script type="text/javascript" src="popup.js"></script>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<!-- <script type="text/javascript" src="js/tag-it.js"></script> -->
</head>
<body>
</body></html>
popup.js
$(document).ready(function(){
$("p").click(function(){
chrome.tabs.getSelected(null, function(tab) {
chrome.tabs.sendRequest(tab.id, {method: "getSelection"}, function (response) {
var text = document.getElementById('text');
text.innerHTML = response.data;
});
});
});
});
on executing this script i am geting the error:
Uncaught ReferenceError: $ is not defined
please help!
2 answers
solution1
13 2013-03-30 12:12:23
You need to change the order of your script tag to allow jQuery to load first:
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="popup.js"></script>
solution2
6 2013-03-30 12:13:18
Change the order .You have to load the jquery core plugin first and then then other plugins
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="popup.js"></script>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.