Erkennen des Dragleave-Ereignisses in Firefox beim Ziehen außerhalb des Fensters

Firefox löst das Dragleave-Ereignis beim Ziehen außerhalb des Fensters nicht richtig aus:

https://bugzilla.mozilla.org/show_bug.cgi?id=665704

https://bugzilla.mozilla.org/show_bug.cgi?id=656164

Ich versuche, eine Problemumgehung dafür zu entwickeln (von der ich weiß, dass sie möglich ist, weil Google Mail sie ausführt), aber das Einzige, was ich mir einfallen lassen kann, scheint wirklich hackisch zu sein.

Eine Möglichkeit, beim Ziehen außerhalb des Fensters zu wissen, ist das Warten auf dasdragover Ereignis, das aufhört zu feuern (weildragover Brände ständig während einer Drag & Drop-Operation). So mache ich das:

<code>var timeout;

function dragleaveFunctionality() {
  // do stuff
}

function firefoxTimeoutHack() {
  clearTimeout(timeout);
  timeout = setTimeout(dragleaveFunctionality, 200);
}

$(document).on('dragover', firefoxTimeoutHack);
</code>

Dieser Code erzeugt und löscht im Wesentlichen immer wieder eine Zeitüberschreitung. Das Zeitlimit von 200 Millisekunden wird erst erreicht, wenndragover Ereignis bricht ab.

Während dies funktioniert, mag ich die Idee, ein Timeout für diesen Zweck zu verwenden, nicht. Es fühlt sich falsch an. Dies bedeutet auch, dass es eine leichte Verzögerung gibt, bevor das "Dropzone" -Stil verschwindet.

Die andere Idee, die ich hatte, war festzustellen, wann die Maus das Fenster verlässt, aber die normalen Vorgehensweisen scheinen bei Drag & Drop-Vorgängen nicht zu funktionieren.

Hat jemand eine bessere Möglichkeit, dies zu tun?

AKTUALISIEREN:

Hier ist der Code, den ich benutze:

<code><!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Drag and Drop Issue</title>
  <script src="http://code.jquery.com/jquery.js"></script>
</head>
<body>
  Open up the console and look at what number is reporting when dragging files in and out of the window. The number should always be 0 when leaving the window, but in Firefox it's not.
  <script type="text/javascript">
    $(function() {
      var counter = 0;
      $(document).on('dragenter', function(e) {
        counter += 1;
        console.log(counter, e.target);
      });
      $(document).on('dragleave', function(e) {
        counter -= 1;
        console.log(counter, e.target);
      });
    });
  </script>  
</body>
</html>
</code>

Antworten auf die Frage(5)

Ihre Antwort auf die Frage