js fichier drop se identifiant principal

Question

Ma page HTML

<div id="myID" class="front" onMouseOver="oneffect(); ondragover="dragover(this);" ondragleave="dragleave(this);"> 
    <img class="withUpload" src="../img/withUpload.png"/> 
    <span class="nbreResult">20</span> 
    <span> 
     <h1>Title</h1> 
    </span> 
</div> 

Mon écoute JS

window.addEventListener("drop",function(e){ 
    alert(e.target.id); 
    e.preventDefault(); 
    getFile(e.dataTransfer, e.target.id) 
},false); 

Lorsque je laisse tomber un fichier sur mon div, je veux obtenir l'ID, mais je viens de réaliser que si l'utilisateur dépose son fichier sur un enfant (title, img, span), alors je ne recevrai aucun identifiant, car ils n'en ont pas. Les utilisateurs doivent donc laisser tomber "zone libre". Comment puis-je faire pour obtenir mon ID DIV partout dans la DIV et pas seulement sur la "zone libre".

Vous pouvez voir my fiddle ainsi Hope I m clair!

Answer 1

Je suggère que vous pouvez utiliser jQuery pour trouver la DIV parent et son ID facilement.

Non testé mais cela devrait fonctionner.

Javascript:

window.addEventListener("drop",function(e){ 
    var id = $(e.target).parents('div.front').attr('id'); 
    alert(id); 
    e.preventDefault(); 
    getFile(e.dataTransfer, e.target.id) 
},false); 

Answer 2

au lieu d'ajouter événement Listener à la fenêtre, l'ajouter à div myID

document.getElementByID("myID").addEventListener(....,function(){...........},...);