Cómo detectar el evento de dragleave en Firefox al arrastrar fuera de la ventana

Question

Apr 20, 2012, 11:17 PM

Cómo detectar el evento de dragleave en Firefox al arrastrar fuera de la ventana

Firefox no dispara correctamente el evento de arrastre al arrastrar fuera de la ventana:

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

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

Estoy tratando de desarrollar una solución alternativa para esto (lo que sé que es posible porque Gmail lo está haciendo), pero lo único que puedo hacer es que me parece realmente hacker.

Una forma de saber cuándo se ha arrastrado fuera de la ventana ha sido esperar a quedragover evento para dejar de disparar (porquedragover se dispara constantemente durante una operación de arrastrar y soltar). Así es como lo estoy haciendo:

<code>var timeout;

function dragleaveFunctionality() {
  // do stuff
}

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

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

Este código es esencialmente crear y borrar un tiempo de espera una y otra vez. El tiempo límite de 200 milisegundos no se alcanzará a menos que eldragover el evento deja de disparar.

Si bien esto funciona, no me gusta la idea de usar un tiempo de espera para este propósito. Se siente mal También significa que hay un ligero retraso antes de que desaparezca el estilo "dropzone".

La otra idea que tuve fue detectar cuándo el mouse sale de la ventana, pero las formas normales de hacerlo no parecen funcionar durante las operaciones de arrastrar y soltar.

¿Alguien por ahí tiene una mejor manera de hacer esto?

ACTUALIZAR:

Aquí está el código que estoy usando:

<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>