I have recently been creating an extension for Google Chrome and the manifest version 2 says that I cannot use event handlers(onclick,onmouseover,ondblclick etc.) INSIDE the html files that I create. It does say that I can create them on the script that I link to it. The only problem is that when I click the icon, the function runs before I click the actual div element. I'm really confused on what I did wrong so I've tried it a couple ways:
My manifest.json file seems to be working fine, I don't get any errors and every page linked works, as well as the icon.png file.
{
"name" : "Test",
"version" : "1.0",
"manifest_version" : 2,
"description" : "Trying it out",
"browser_action" : {
"default_icon" : "icon.png",
"defalut_title" : "Test",
"default_popup" : "popup.html"
},
"chrome_url_overrides" : {
"newtab" : "newtab.html"
}
}
Here is what I put in my popup.html file:
<html>
<head></head>
<body>
<div id="submitButton">Submit!</div>
</body>
</html> <!-- The rest of the code is unnecessary since it is not used as for now -->
<script type="text/javascript" src="popup.js"></script>
My popup.js file has this function:
var sButton = document.getElementById('submitButton');
sButton.addEventListener('onclick',alert('This is not supposed to happen until I click the div'),false);
//I also put the alert in a function like so: function() {alert('what it said')}
After I noticed that this way didn't work, I went with this:
sButton.onclick = function() {alert('same thing')}
Either of the ways I did it would alert when I clicked the extension icon and it didn't even run the popup.html. I don't know if I need to add a function to it but since I'm new to this (my first extension) I don't really know if I'm supposed to add a special chrome method or something. I've looked through the Google Dev page but it didn't help. It only taught me the basics.
Any help will be appreciated, thanks in advance.