jQuery className ne fonctionne pas

Question

Dans ces 2 exemples, le premier fonctionne.

Dans le deuxième exemple que je lierdragover et DragLeave événements à img au lieu de div mais je veux changer className pour div. Les événements sont correctement détectés et aucune erreur n'est générée, mais div ne change pas sa classe.

Où est le problème?

//This work 
 

 
$(document).ready(function() { 
 
    $("#framedrag").bind("dragover dragleave", function(e) { 
 
     e.stopPropagation(); 
 
     e.preventDefault(); 
 
     e.target.className = (e.type == "dragover" ? "hover" : ""); 
 
     return false; 
 
    }); 
 
}); 
 
    
 

 
//This don't work 
 

 
$(document).ready(function() { 
 
    $("#dragdrop").bind("dragover dragleave", function(e) { 
 
     e.stopPropagation(); 
 
     e.preventDefault(); 
 
     $("#framedrag").className = (e.type == "dragover" ? "hover" : ""); 
 
     return false; 
 
    }); 
 
});

#framedrag 
 
{ 
 
    \t color: #555; 
 
    \t border: 2px dashed #555; 
 
    \t border-radius: 7px; 
 
    \t cursor: default; 
 
} 
 

 
#framedrag.hover 
 
{ 
 
    \t color: #3fc600; 
 
    \t border-color: #3fc600; 
 
    \t border-style: solid; 
 
}

<script  src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="preview-pane"> 
 
    <div id="framedrag"> 
 
     <div class="preview-container"> 
 
      <img id="dragdrop" src="images/upload-picture.png" class="jcrop-preview" /> 
 
     </div> 
 
    </div> 
 
</div>

Answer 1

Essayez cette $("#framedrag").attr("class", e.type == "dragover" ? "hover" : "");