обнаружить мышь за пределами элемента mousedown

Я пытаюсь обнаружить, когда мышь (кнопка мыши выпущена) происходит вне элемента, в который был запущен событие mousedown. У меня есть несколько кнопок, которые я изменяю CSS (используя классы) с mousedown (нажатие кнопки) и завершение щелчка (mousedown + mouseup). Проблема в том, что если вы нажмете на элемент, отпустите кнопку мыши за пределами элемента, чтобы мышь не срабатывала. Я также попытался захватить общее событие «mouseup» в документе, чтобы «сбросить» классы, назначенные этому элементу, и это тоже не работает.обнаружить мышь за пределами элемента mousedown

Вот пример HTML:

<div class="qbuttons"> 
<a id="qb_appointments" href="#" class="appointments"><div> 
Schedule a Service<br /> 
Appointment</div></a> 
</div>

Вот JQuery, который я использую, чтобы возиться с элементом:

var current_qbutton = ""; 

$('.qbuttons a').mousedown(function() { 
    current_qbutton = $(this).attr('id'); 
    $(this).addClass('active'); 
}); 

$('.qbuttons a').click(function() { 
    $(this).removeClass('active'); 
}); 

$('*').mouseup(function(event) { 
    event.stopPropagation(); 
    alert(current_qbutton); 
    if(current_qbutton != "") { 
     $('#' + current_qbutton).removeClass('active'); 
     current_qbutton = ""; 
    } 
});

Я пробовал разные селекторы для MouseUp - документ , window, 'body *', 'html ' и '' - из того, что я вижу, кажется, что мышь не стреляет при выпуске кнопки мыши вне элемента mousedown, потому что предупреждения не происходит.

источник

2013-07-02 Rob Emenecker

Вы поняли это, события mousedown/mouseup не работают таким образом, поэтому вам придется выяснить какой-то другой способ сделать то, что вы пытаетесь сделать. Вот скрипка для игры -> http://jsfiddle.net/xQamz/ – adeneo

Причина, по которой это не работает, связано с элементом anchor (который, кажется, не служит цели). Вы можете удалить a и заменить его на div или span или что-то еще, что вам нравится, а затем событие mouseup может быть запущено за пределами элемента.

Это, кажется, работает для меня. http://jsfiddle.net/FXnsx/3/

var current_button; 
$('.test').on('mousedown', function(){ 
    current_button = this.id; 
}); 
$(document).on('mouseup', function(){ 
    alert(current_button); 
});

источник

2013-07-02 22:41:09 Joe

Элемент привязки будет привязан к фактическому URL-адресу. В коде вместо этого есть символ хэша в качестве заполнителя. Внешние div.qbuttons содержат один или несколько элементов привязки. –

Хорошо, @Joe теперь здесь, где еще страннее. Я изменил код JS Fiddle, чтобы более точно походить на мою структуру, и ваш код все еще работает. Я изменил свой код, чтобы больше походить на ваш, и мой код все еще не работает. Предполагается, что это простой эффект кнопки, и я использую jQuery, потому что Internet Explorer неправильно реализует: активный псевдокласс таким образом, чтобы я мог заставить его работать для меня. Grr. Вот что у меня сейчас есть: http://jsfiddle.net/hairydogdigital/R6bq3/10/ –

Если я хорошо понимал, вы можете использовать этот тип ловли всего MouseUp документа и проверить внутри, если цель это или нет, то решить, что вы хотите.

$(document).mouseup(function (e) { 
var buttons = $("#btn1, #btn2"); 
if (!buttons.is(e.target) //clicking target is not the buttons 
{[desision 1] } 
else 
{ [desision 2] } 
});

Надеюсь, что эта помощь.

источник

2015-10-22 13:43:01 QMaster

обнаружить мышь за пределами элемента mousedown

ответ

Смежные вопросы