Click event seems to fire twice

JavaScript
1

Hello,

I am trying to understand better events:



(function(){


var self = TestEvent = {
	
	element: '',
	
	doSomething: function(e){
                self.element = this;
		e.stopPropagation()
		alert(self.element);
		return false;	
	},
	
}

var myElements = getElementsByClassName('test-elements');

for (var k in myElements) {
	
	myElements[k].addEventListener("click", TestEvent.doSomething , false);	
}


})();

When a link is clicked that triggers the “click” event, the element is alerted BUT the browser follows the link, as if the “return false” was not working.

  1. What could cause this? What am I missing?

  2. I feel like my code is poorly designed. Could someone be kind enough to tell how to refactor such a simple snippet (so I dont find myself caught once the code gets more complicated).

:slight_smile:

2

return false doesn’t prevent the default when you are using event listeners (it only works with event handlers).

For event listeners you prevent the default action using"

e.preventDefault();