I have this function , which is supposed to prevent the browser from doing the default action(event.preventDefault()
, which is navigating to another page to display a big otter image when you click the otter thumbnail in the index page .
function addThumbClickHandler(thumb) {
‘use strict’;
thumb.addEventListener(‘click’, function (event) {
event.preventDefault();
setDetailsFromThumb(thumb);
});
}
This code works on Firefox , but not on Chrome .
Any ideas why is this happening ?
Hi @Sam! Sorry about the delay in getting to this.
Sounds like there may be an exception happening. To debug this, click “Preserve log” in the Chrome console, clear it, then try clicking the image. It’s possible there is an error occurring, but the log usually gets cleared before you have a chance to see the error on navigating to a new page.
Also, stick a console.log in your callback function to make sure the event listener is being invoked in the first place.
Hope that helps!
Hi @nybblr! I have the almost the same problem. event.prefentDerfault() works in the Console. It refuses to work when called in main.js.
I did select “Preserve Log” but no error is shown.
Help, please!
Ok, well, I guess I can let this go. I worked on it for two days. I deleted main.js completely and recreated it from scratch three times. Never could get event.preventDefault() to work from the script.
I finally just created all seven functions in main.js at time. It works now.
This stuff can make you crazy sometimes.
Hi @dartagnan! Glad to hear you got it working. I’ll bet one of the <script> tags was missing or not being executed, you might trying adding a console.log("Running main.js...") line to every JS file to which ones are being loaded and in what order. If some are missing, you might want to double check the <script> tag in index.html and also make sure you are using the HTML5 doctype.