Please I need your help with the code below. I want to add an onclick event to a whole DIV to redirect to an url but I cannot bypass the href included in a child anchor inside the DIV.:
i.e. (The goal is to redirect to google.com clicking anywhere on the image or the text):
<html>
<div onclick="location.href='http://www.google.com'">
<div>
<a href="http://en.wikipedia.org/">
<img height="200" width="200" src="http://upload.wikimedia.org/wikipedia/commons/6/63/Wikipedia-logo.png">
</a>
Test
</div>
</div>
</html>
This works fine when I use a local URL like 'file:///E:/Documents/Blog/Design/Tmp1.html' (I don't know why). Thank you.
Update: I'm adding the idea behind this request: I need this for the Index section of my blog that Blogger builds with the same routine that it uses for individual posts. In the Index I want that every click in the main Div redirects to the Post, but inside the post a click in the image must goes to the image's href. My idea was that the "onclick" event it's added dinamically to the DIV only for the Index section.
If you're intent on doing this inline (not recommend but it's your code), you can add a return false; to the inner anchor:
<html>
<div onclick="location.href='http://www.google.com'">
<div>
<a href="http://en.wikipedia.org/" onclick="return false;">
<img height="200" width="200" src="http://upload.wikimedia.org/wikipedia/commons/6/63/Wikipedia-logo.png">
</a>
Test
</div>
</div>
</html>
Update: based on step 2 of your request (this is a terrible, terrible idea for a number of reasons but it works):
<html>
<div onclick="location.href='http://www.google.com'">
<div>
<a href="http://en.wikipedia.org/" onclick="if ( this.parentElement.parentElement.onclick ) { return false; }" id="demo">
<img height="200" width="200" src="http://upload.wikimedia.org/wikipedia/commons/6/63/Wikipedia-logo.png">
</a>
Test
</div>
</div>
</html>