Astuce Javascript+html: Avoir un comportement normal sur le drop avec Firefox

Note pour la prochaine fois que je voudrai faire un drag & drop de fichiers sur Firefox

Comme découvert grâce à ArthurHoaro, pour obliger le navigateur à gérer le drop de fichier sur une dropzone, il faut d'abord faire un preventDefault() sur les événements dragover et/ou dragenter.

solution N°1

On peut le faire en dur dans le HTML:

<div ondragover="return false">
<div ondragover="event.preventDefault()">

Ce qui peut même servir pour le ciblage du drop avec un sélecteur genre *[ondragover]

Solution N°2

On peut bien entendu également le définir directement dans le js:

document.getElementById("body").addEventListener("drop",function(e){
        console.log(e);
        e.preventDefault();
        e.stopPropagation();
})
document.getElementById("body").addEventListener("dragover",function(e){
        e.preventDefault();
        e.stopPropagation();
})
document.getElementById("body").addEventListener("dragenter",function(e){
        e.preventDefault();
        e.stopPropagation();
})

Je sers la programmation et c est ma joie   (1).jpg

Sources:

✍ Écrire un commentaire

Inutile de poster un commentaire à la con pour vous faire de la pub, ce sera filtré et dégagé direct...

Quelle est la première lettre du mot qivef ?