Edit Question - KnowledgeHub

Title Body

I'm just wondering why click event happening when I dbclick an element? I have this code:( JSBIN ) HTML <p id="hello">Hello World</p> JavaScript document.getElementById('hello').addEventListener('click', function(e){ e.preventDefault(); this.style.background = 'red'; }, false); document.getElementById('hello').addEventListener('dbclick', function(){ this.style.background = 'yellow'; }, false); It should do different things for click and double click, but it seems when you double click on the p it catch click event in advance and ignore double click. I tried preventDefault the click event too. How can I listen to just dbclick ? UPDATE I had a typo in my code. dbclick is wrong. It's dblclick . Anyway the problem still exist. When user double clicks the click event happens. This is updated code that prove it:( JSBin ) document.getElementById('hello').addEventListener('click', function(e){ e.preventDefault(); this.style.background = 'red'; this.innerText = "Hello World clicked"; }, false); document.getElementById('hello').addEventListener('dblclick', function(){ this.style.background = 'green'; }, false);

Tags (comma-separated) Cancel