javascript - Javascript: windows,document,body mouseup listen issue while dragging

Question

http://jsfiddle.net/TMmgt/4/

html:

<a href="javascript:void(0);">some text</a>​

js:

var down=false;    

$('a').mousedown(function(){
    down=true;
});

$('a').mouseup(function(){
    down=false;
});

$('a').mousemove(function(){
    if(down){
       console.log('Mouse is still down!');
       // do something        
    }
});

$(window,document,'body').mouseup(function(){
    down=false;
});​

Drag link anywhere in the body and release, then move cursor over the link again. Mouse move will still be showing that down is true, because mouseup was not triggered and haven't changed it to false. Then just click anywhere in body and move over link again. Now down is true

Any workaround for this issue?

As i understand, it's because of default browser <a> drag behavior.

Answer 1

http://jsfiddle.net/TMmgt/5/

var down=false;


$('a').mousedown(function(e){
    e.preventDefault();
    down=true;
});

$('body').mouseup(function(e){
    e.preventDefault();
    down=false;
    check();
});

$('a').mousemove(function(e){
    e.preventDefault();
    if(down){
       console.log('Mouse is still down!');
       // do something        
    }
});

function check(){
    if(down==false) {
    console.log('Mouse is up!');
}
}

​</p>