Mousedown回調不會停止

Question

我試圖跟蹤鼠標的位置，而你點擊和拖動div內，只有當你點擊和拖動。我用

$("div").mousedown(function() { 
     $("div").mousemove(function(event) { 
       $('div').html("(" + event.clientX + ", " + event.clientY + ")"); 
     }); 
    }) 

我也曾嘗試

$("div").bind("mousedown mouseup", function() { 
    $("div").mousemove(function (event) { 
     $('div').html("(" + event.clientX + ", " + event.clientY + ")"); 
    }); 
}); 

但他們都保持跟蹤鼠標的位置，即使以後我放開鼠標。我停止點擊後如何停止它？

值得注意的是，我看到this questions的答案，它不適用於我，我不知道爲什麼。

JSFiddle

Answer 1

類似的東西？

$("div").mousedown(function() { 
    $("div").on('mousemove', function(event) { 
     $('div').html("(" + event.clientX + ", " + event.clientY + ")"); 
    }); 
}) 

$("div").mouseup(function() { 
    $("div").off('mousemove'); 
}) 

http://jsfiddle.net/7G7tx/2/

按下鼠標按鈕時，您綁定事件和解除綁定按鈕被釋放時。

Answer 2

問題是，您沒有清理您的事件處理程序，而是添加越來越多。

檢查了這一點

$("div").mousedown(function() { 
    var mouseMoveHandler = function (event) { 
     $('div').html("(" + event.clientX + ", " + event.clientY + ")"); 
    }; 

    var mouseUpHandler = function (event) { 
     $("div") 
      .off('mousemove', mouseMoveHandler) 
      .off('mouseup', mouseUpHandler); 
    }; 

    $("div") 
     .on('mousemove', mouseMoveHandler) 
     .on('mouseup', mouseUpHandler); 
}); 

http://jsfiddle.net/7G7tx/3/