Pourquoi le glisser-déposer HTML5 ne fonctionne-t-il pas dans Firefox?

J'ai lié des événements à différents éléments, et quand je les fais glisser dans tous les navigateurs, sauf Firefox, cela fonctionne comme prévu. Dans firefox, cependant, cela ne fonctionne pas du tout. Le seul événement qui se déclenche est dragstart, et aucun des autres événements de l'incendie. Ce qui se passe?

27
demandé sur RandallB 2013-09-27 20:01:51

4 réponses

Je n'utilise pas jQuery, donc supprimé la partie originalEvent et changé le format en texte (ou IE avait problème), et cela fonctionne:

event.dataTransfer.setData('text', 'anything');  

Dans les autres événements, assurez-vous d'appeler:

event.preventDefault();

Ou il va sauter à anything.com sur certains événements.

24
répondu Carson Holmes 2017-05-20 02:19:12

Firefox exige qu'un utilisateur exécute la fonction dataTransfer.setData dans l'événement.

Pour vos utilisateurs jQuery, cela signifie que le code suivant devrait résoudre votre problème:

function dragstartHandler(event){

  event.originalEvent.dataTransfer.setData('text/plain', 'anything');

}

Les événements futurs sur la même traînée se déclencheront maintenant correctement comme prévu. Évidemment, vous pouvez remplacer les arguments setData par des données plus utiles.

28
répondu RandallB 2013-09-27 16:05:48

FF a des problèmes de longue date avec la consommation de certains événements de souris qui proviennent d'éléments dont le débordement est défini sur auto ou scroll.

Dans mon cas, j'avais une bibliothèque bien utilisée pour le glisser-déposer qui fonctionnait parfaitement dans les échantillons et dans mon application sur tous les navigateurs sauf firefox. Après avoir fouillé les tickets liés à cela, j'ai trouvé une solution que je crédite entièrement à un contributeur à ce ticket https://bugzilla.mozilla.org/show_bug.cgi?id=339293

Qui est à définir - MOZ-user-select: aucun

Sur l'élément défilant en cours de déplacement. Il a résolu mon problème en particulier.

5
répondu user3795410 2017-06-02 00:20:53

Vous pouvez l'utiliser comme référence pour cette solution de question concernant les redirections qui se produisent sur Firefox.

Vous devez empêcher l'action par défaut dans la méthode drop pour résoudre ce problème.

function drop(e) {
    if(e.preventDefault) { e.preventDefault(); }
    if(e.stopPropagation) { e.stopPropagation(); }

    //your code here

    return false;
}

J'ai obtenu cette solution de ce lien .

2
répondu Akhilesh Sehgal 2017-05-23 12:26:27