Обратный вызов Mousedown не остановится

Я пытаюсь отслеживать положение мыши, когда вы щелкаете и перетаскиваете внутри 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 + " )");
    });
});

но они оба продолжают отслеживать положение мыши даже после того, как я отпустил мышь. Как я могу остановить это после того, как перестану нажимать?

Стоит отметить, что я видел ответ на эти вопросы, он не будет работать на меня, и я не уверен, почему.

JSFiddle


javascript html jquery mouseevent mousedown
person EasilyBaffled    schedule 05.05.2014    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Что-то такое?

 $("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/

Вы привязываете событие при нажатии кнопки мыши и отвязываете его при отпускании кнопки.

person Getz    schedule 05.05.2014
comment
это удалит все обработчики mousemove из целевого div, что может нарушить другие связанные с ним функции. - person Anton Boritskiy; 05.05.2014

arrow_upward
1
arrow_downward

Проблема в том, что вы не чистите свои обработчики событий, а вместо этого добавляете все больше и больше.

Проверь это

 $("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/

person Anton Boritskiy    schedule 05.05.2014