Javascript Girl
  1. Javascript Girl
  3. HTML5 Glisser-déposer getData () ne fonctionne que sur Drop Event dans Chrome?
Intereting Posts
La fenêtre est-elle vraiment globale en Javascript? Créer Highchart (tableau des colonnes) et lire les données du fichier json externe Jappage de Javascript Envoyer un paquet udp à partir de chrome Rendre Reagir les composants avec des promesses dans la méthode de rendu Appelez href depuis JavaScript Impossible d'inclure le fichier javascript du répertoire WEB-INF dans JSP. Effet de texte de pont dans le canevas HTML5 Envoi d'une demande de publication avec Javascript pour décharger / pré-charge. Est-ce possible? Récupérer des menus déroulants avec des entrées MySQL Zepto replique vers jQuery Comment remplir la grille de Kendo avec un appel angulaire de $ http GET Obtenir la source de la page actuelle en utilisant javascript et DOM Comment envoyer une requête HTTP sur une base annuelle dans AngularJS? Désactiver le mode de compatibilité IE 8 pour le site

HTML5 Glisser-déposer getData () ne fonctionne que sur Drop Event dans Chrome?

Je travaille actuellement sur un projet au travail en utilisant l'API de glisser-déposer HTML5 pour fournir des fonctionnalités supplémentaires, y compris la glissade d'éléments dans et hors des navigateurs. Je rencontre actuellement des problèmes spécifiques à Chrome (autrement, uniquement testés dans Firefox, ce qui fonctionne comme prévu).

Le problème est que je ne peux pas utiliser la event.dataTransfer.getData(type) pour renvoyer l'ensemble de données sur l'événement dragstart dans tous les événements sauf l'événement drop .

J'ai réglé l'événement ainsi, après avoir dragstart événement dragstart (qui dragstart fire): 

 event.dataTransfer.setData('text/plain', "some string")

Ensuite, dans l'événement drop , je peux obtenir les données correctes. 

 event.dataTransfer.getData('text/plain')

Cependant, je ne peux pas utiliser la même méthode que ci-dessus sur tout autre événement (tel que dragover ). Même si j'essaie d'utiliser la méthode ci-dessus sur la ligne après l'appel de setData() (c.-à-d. dragstart rappel de dragstart ), elle va toujours revenir undefined .

Ainsi, dans Chrome, le problème est que getData dans Chrome retournera toujours undefined , sauf dans le rappel de l'événement drop . (Dans Firefox, je peux obtenir avec succès les données correctes.)

Si vous avez la référence à l'objet dataTransfer du même élément de glisser, pourquoi ne devriez-vous pas pouvoir obtenir les données jusqu'à ce qu'elles soient supprimées?

Je me demandais juste:

  • Quelqu'un at-il eu ce problème avec Chrome avant?
  • Quelles sont les solutions de contournement?
  • Ou, est-ce quelque chose que Chrome doit réparer?

Ressources: Spécification pour le glisser-déposer HTML5.

WebKit, et donc Chrome, est assez restrictif lorsque vous pouvez appeler getData . Vous n'êtes pas autorisé à le faire dans dragstart ou dragover . Je pense que c'est le bogue canonique .

Référencer cette réponse :

Les données ne sont disponibles qu'en drop, il s'agit d'une fonctionnalité de sécurité car un site Web peut saisir des données lorsque vous traitez quelque chose sur la page Web.