如何停用div作为dropzone

Question

我有三个带有标题的div和另一个更大的div中的图像。我试图拖放它们，但是如果我把它放在另一个div之上，它们就会互相掉落。如何禁用图像作为dropzone的de div？ 我使用JavaScript，HTML和CSS。

<div class=dirFiles>
    <div draggable='true' onmousedown='ablegenVerbieten()' class='file'>
        <p>Title</p>
        <img></img>
    </div>
    <div draggable='true' onmousedown='ablegenVerbieten()' class='file'>
        <p>Title</p>
        <img></img>
    </div>
    <div draggable='true' onmousedown='ablegenVerbieten()' class='file'>
        <p>Title</p>
        <img></img>
    </div>
</div>
     <script>

       function ziehen(ev) {
         ev.dataTransfer.setData('text', ev.target.id);
       }

       function ablegenErlauben(ev) {
         ev.preventDefault();
       }

       function ablegenVerbieten(ev) {
         oevent.preventDefault ? event.preventDefault() : event.returnValue = false;
       }

       function ablegen(ev) {
         ev.preventDefault();
         var data = ev.dataTransfer.getData('text');
         var target = ev.target;
         while (" "+target.className+" ".indexOf(" dirFiles ") == -1) target = target.parentNode;
         target.appendChild(document.getElementById(data));
       }

       window.addEventListener("load",function () {
         var elms = document.querySelectorAll(".dirFiles");
         for (var i = 0; i < elms.length; i++) {
           var dirFiles = elms[i];
           dirFiles.addEventListener("drop",ablegen);
           dirFiles.addEventListener("dragover",ablegenErlauben);
         };

         elms = document.querySelectorAll("[draggable=true]")
         for (var i = 0; i < elms.length; i++) {
           var draggable = elms[i];
           draggable.addEventListener("dragstart",ziehen);
         };
       });
     </script>