Hyperlinks are designed for clicking, to lead you somewhere else, but sometimes this behavior is undesired. In my case a grid control displayed some HTML data in its cells (including hyperlinks) and clicking on those links caused some undesired effects. I still wanted to display HTML and allow clicking on other grid elements (e.g. checkboxes) just needed a way to prevent hyperlinks clicks.
Remember that events bubble? That gave me an idea to wrap the grid control in a DIV to catch click events. This way I can check event source and if it’s a hyperlink – cancel the event, otherwise allow it. Well that’s pretty much it. Here’s a stump for the DIV wrapper:
<div onclick="return checkClickSrc()"> <!-- Controls to check go here--> </div>
and here’s the JavaScript code that does the check:
function checkClickSrc() { return event.srcElement.tagName != 'A' //for firefox: return event.target.tagName != 'A' }