stopImmediatePropagation not working as expected

Question

Consider the following code :

HTML

<a href="http://www.google.com" target="_blank" id="myLink" class="anyclass">testlink</a>

JAVASCRIPT

$('#myLink').on("mousedown",doMouseDown);

function doMouseDown(e)
{
    e.stopImmediatePropagation();
    console.log("Mouse down");
    return true;
}

It's a very simplified version of my code, but the problem is exactly the same. In 2 words : using e.stopImmediatePropagation() in my handler, I would expect that I'm not sent to Google when I click the link. I should only get the console.log() executed. All my research indicate that I'm right to think so, but still it's executing both the "mousedown" handler, and the default "click" handler for a link (i.e. it opens Google in a new tab).

I've tried, without conviction, to add a e.preventDefault() as first instruction of my handler, I've tried returning false , I've tried defining my handler as an anonymous function when binding, I've tried simply calling it from an anonymous function, all this in different combinations, without any improvement. I must admit I'm quite out of ideas to fix this. Would any of you be so kind to point me in the right direction ? Any help would be grandly appreciated.

If you want to test, here's the fiddle

Answer 1

Try this

var i=0;
$('#myLink').on('mousedown mouseup click', function(e) {

    e.preventDefault();
    e.stopImmediatePropagation();
    console.log(e.type);
    console.log(i);
    i++;
});

prints in console

"mousedown"
0
"mouseup"
1 
"click"
2

and using

var i=0;
$('#myLink').on('mousedown mouseup click', function(e) {
if(i>0)
    {
    return false;
    }
e.preventDefault();
e.stopPropagation();
console.log(e.type);
console.log(i);
i++;
 });

Prints in console

"mousedown"
0