detect mouseup außerhalb von mousedown element

Ich versuche zu erkennen, wenn das mouseup (Maustaste losgelassen) außerhalb des Elements auftritt, an dem das mousedown-Ereignis ausgelöst wurde. Ich habe mehrere Buttons, mit denen ich das CSS (durch Verwendung von Klassen) mit einem Mouse-Down (Tastendruck) und Abschluss eines Klicks (Mouse-Down + Mouse-Up) verändere. Problem ist, dass, wenn Sie auf das Element klicken und dann die Maustaste außerhalb des Elements loslassen, der Mouse-Up nicht ausgelöst wird. Ich habe auch versucht, ein allgemeines "mouseup" -Ereignis auf dem Dokument zu erfassen, um die dem Element zugewiesenen Klassen "zurückzusetzen", und das scheint auch nicht zu funktionieren.detect mouseup außerhalb von mousedown element

Hier ein Beispiel HTML:

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

Hier ist die jQuery, die ich mit dem Element zur Geige bin mit:

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 = ""; 
    } 
});

ich verschiedene Selektoren für die mouseup versucht haben - Dokument , Fenster, 'Körper *', 'html ' und '' - von dem, was ich sehe, scheint es, dass der MouseUp nicht auf die Freigabe der Maustaste außerhalb des MouseDown-Elements ausgelöst wird, weil die Warnung nicht passiert.

Quelle

2013-07-02 Rob Emenecker

Sie haben es herausgefunden, die mousedown/mouseup Ereignisse funktionieren nicht auf diese Weise, also müssen Sie einen anderen Weg finden, um zu tun, was auch immer Sie versuchen zu tun. Hier ist eine Geige zum spielen -> http://jsfiddle.net/xQamz/ – adeneo

Der Grund, dass dies nicht funktioniert, liegt an dem Element anchor (das scheint keinen Zweck zu erfüllen). Sie können die a entfernen und durch eine div oder span oder was auch immer Sie möchten ersetzen und dann das mouseup Ereignis kann außerhalb des Elements ausgelöst werden.

Das scheint für mich zu arbeiten. http://jsfiddle.net/FXnsx/3/

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

Quelle

2013-07-02 22:41:09 Joe

Das Ankerelement wird gerne eine tatsächliche URL. Der Code enthält nur das Hash-Zeichen als Platzhalter. Die äußeren div.qButtons enthalten eines oder mehrere der Ankerelemente. –

Okay @Joe jetzt hier ist, wo es noch seltsamer ist. Ich habe Ihren JS-Fiddle-Code an meine Struktur angepasst und Ihr Code funktioniert immer noch. Ich habe meinen Code so geändert, dass er dem deines Computers ähnelt, und mein Code funktioniert immer noch nicht. Dies soll ein einfacher Button-Effekt sein und ich benutze jQuery, weil Internet Explorer die: active Pseudo-Klasse nicht richtig implementiert, so dass ich es für mich arbeiten kann. Gr. Hier ist, was ich derzeit an Ort und Stelle habe: http://jsfiddle.net/hairydogdigital/R6bq3/10/ –

Wenn ich gut verstanden können Sie diese Art der Verwendung mouseup gesamtes Dokument zu kontrollieren und innen überprüfen, ob das Ziel dieser ist oder nicht dann entscheiden, was Sie wünschen.

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

Hoffe diese Hilfe.

Quelle

2015-10-22 13:43:01 QMaster

detect mouseup außerhalb von mousedown element

Antwort

Verwandte Themen