den aktuellen Zustand einer Maus in Javascript oder jQuery erkennen, d. h. ob sie down oder up ist

8

Ich baue eine Webanwendung, die viel Text von der Webseite und von anderen Anwendungen, zB Word- und PDF-Dokumenten, zieht und löscht. Ich muss den aktuellen Zustand der Maus erhalten, wenn sie runter (geklickt) oder hoch (losgelassen) ist. Derzeit kann ich den aktuellen Zustand der Maus erhalten, wenn ich Text innerhalb der Webseite schleppe, aber nicht in der Lage bin, den Mausstatus zu erhalten, wenn die Maus von einer anderen Anwendung kommt, Wort sagen und etwas Text ziehen. Irgendwelche Zeiger, um den Zustand der Maus nach unten oder oben zu erhalten, werden wirklich geschätzt.

    
Shadrack B. Orina 11.04.2012, 09:30
quelle

4 Antworten

3

Das Problem, so wie ich es verstehe, besteht darin, dass Sie feststellen müssen, ob die linke Maustaste gedrückt wird, wenn es außerhalb des Fensters gedrückt wurde (für eine Ziehoperation).

Es gibt eine Reihe von Problemen:

  • Es gibt keine mousemove-Ereignisse, die während einer Ziehoperation ausgelöst werden
  • Daten der aktuellen Schaltflächenstatus unterscheiden sich zwischen den Browsern

Ich habe diese Lösung gefunden:

%Vor%

Die obige Lösung bindet an das mousemove-Ereignis und das Dragover-Ereignis. Chrome ruft ein gültiges Ereignisobjekt mit den richtigen Schaltflächenwerten im Dragover-Ereignis ab. Ich habe jedoch festgestellt, dass FireFox dies nicht getan hat. Ich denke, dass der Zustand der linken Maustaste während einer Ziehoperation ziemlich offensichtlich ist, es wird gedrückt , richtig? Sie können nicht ziehen, ohne zu klicken und sich zu bewegen. Also setze ich den Status auf 1 (links unten) beim Dragover. Entsprechend wird der Wert bei Dragleave auf Null gesetzt.

Sie würden alle normalen Dragover-, Dragstart-, End-, Drop-, usw. -Verarbeiten durchführen, um die Standard-Browser-Aktionen zu verhindern, und der von window.getButtonState () zurückgegebene Wert sollte immer der Wert der derzeit aktiven Maustaste sein / p>

Hier ist eine Beispielanwendung, die den Wert des ersten h1-Tags auf der Seite auf die aktuell gedrückte Schaltfläche setzt:

%Vor%

Sie müssen einige Crossbrowser durchführen, um die verschiedenen Werte zu bearbeiten (FF berichtete 4 für die mittlere Schaltfläche usw.), aber Sie sollten die aktuelle Schaltfläche mit dieser Methode einigermaßen gut erhalten können.

Probieren Sie es aus: Ссылка

    
Luke Channings 18.07.2013, 23:18
quelle
2

Wenn Sie Text in einem externen Programm (z. B. Word) auswählen und auf eine Webseite ziehen, generieren Elemente auf der Seite dragenter Mausereignisse. Ich habe das in Chrome getestet und es hat für mich funktioniert. Zum Beispiel kann ich einen dragenter Listener an document.body binden und die Ereignisse empfangen, obwohl keine normalen Mausereignisse ausgelöst werden:

%Vor%

Vielleicht können Sie das zu Ihrem Vorteil nutzen, da das Ereignis dragenter bedeutet, dass die Maus zieht und die Schaltfläche gedrückt werden muss. Außerdem können Sie den gezogenen Text abrufen, indem Sie die Daten aus dem Ereignis abrufen:

%Vor%

Sie müssen den korrekten Datentyp im getData -Aufruf verwenden. Ich tippte Text in Word ein und konnte den gezogenen Text mit text/plain erhalten.

    
Zenwolf 21.07.2013 21:40
quelle
0

Haben Sie eine Variable mit dem Status: Demo - Code

%Vor%

Dann können Sie _isMouseDown überprüfen, um zu sehen, ob die Maus nicht aktiv ist.

Oder kompakter: Demo - Code

%Vor%

Wenn Sie keine globalen Variablen möchten, können Sie _isMouseDown speichern. Werfen Sie jQuerys data methode: Demo - < a href="http://jsbin.com/ubawek/3/edit"> Code

%Vor%

Und check throw: $(document).data("_isMouseDown")

andlrc 11.04.2012 09:43
quelle
0

Sie suchen nach neuen, robusten HTML5-Drag & Drop-Funktionen Ссылка

Das Ereignis, nach dem Sie suchen, ist "drop"

%Vor%

Natürlich sollten Sie diesen Code in die js-Datei verschieben, aber dies gibt Ihnen ein Beispiel, was gemacht wurde. Vielleicht möchten Sie lesen, was in diesem Drop-out ist, verwenden Sie es sogar für Uploads.

Hier finden Sie detaillierte Informationen über event.dataTransfer Ссылка

    
Artek Wisniewski 17.07.2013 07:31
quelle