Два обработчика событий jQuery - выполняют код при запуске обоих

Question

Я хочу запустить некоторый код, когда два обработчика событий сработали.Я попробовал это так:

$('#box').mousedown(function(){ 
    $(document).bind('mousemove',function(e){ 
       // more code here 
    }); 
}); 

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

Answer 1

Я думаю, что ваша проблема в том, что вы понимаете, как работают обработчики событий, после того, как вы добавили обработчик событий, он будет прослушивать его событие.

Таким образом, ваш код добавит событиеобработчик для прослушивания mousedown, когда dom готов, после того, как это произойдет, он добавит событие для mousemove - теперь в документе зарегистрированы оба обработчика событий, поэтому он будет обрабатывать оба независимо.

Чтовы хотите сделать, это удалить обработчик события mousemove для события mouseup.Таким образом, теперь документ больше не слушает обработчик событий mousemove, поскольку он был удален.

$('#box').mousedown(function(){
    $(document).bind('mousemove',function(e){ 
        // Do something:
    }); 
});
$(document).mouseup(function(){
    $(document).unbind('mousemove'); 
});

Вот простой пример , так что вы можетеПосмотрите, что происходит, он добавит сообщение под box.

Answer 2

Попробуйте попробовать?Имейте глобальную переменную, которая указывает, нажата ли мышь или нет.Когда они помещаются на элемент #box, глобальной переменной присваивается значение true.Когда они наведены мышью, он возвращается в false. Смотрите живой пример здесь .

$(document).ready(function(){
    var mouseDown = false;

    $("#box").mousedown(function(){
        mouseDown = true;
    });

    $(document).mouseup(function(){
        mouseDown = false;
    });

    $(document).mousemove(function(){
        if (mouseDown){
            //do your stuff here
        }
    });
});

Answer 3

Используйте

event.stop()

или

event.die()

фрагмент перед использованием события. Пример:

$("#mybutton").unbind("click");
$("#mybutton").die();
$("#mybutton").click(function(){ alert("Hy mate!");});