Question

I am trying to add an event handler to a div that has an image inside of the div. My problem is that the event only works if you double click outside the div right next to it. When you double click the picture inside the div it doesnt not trigger the event. How do I make it so that the event works both ways?

html

<div id="placeholder">
    <a href="http://google.com" target="_blank">
        <img src="http://www.fat-animals.com/wp-content/uploads/2009/03/11.jpg" alt="" />
    </a>
</div>

javascript

var pic;
pic = document.getElementById("placeholder");
pic.ondblclick = function() {
    pic.innerHTML = "blocked!";
}

demo
http://jsfiddle.net/9DWrN/

Answer 1

check this fiddle
http://jsfiddle.net/unloco/9DWrN/3/

var pic = document.getElementById("placeholder");
var clicked = false;
pic.onclick = function() {
    if(clicked) {
        pic.innerHTML = "blocked!";
    } else {
        clicked = true;
    }
    setTimeout(function(){
        clicked = false
    }, 333); //detect fast clicks (333ms)
}​