Désactiver le glissement lorsque le glissement s'arrête

Question

J'ai 3 blocs (div). Quand il y a un clic dans un de ces blocs, le div est sélectionné et il est visible par une classe.

Je dois désactiver le draggable() de l'élément depuis l'arrêt même dans la fonction de glissement. JS:

$('#llens').on("click", "#mou", function (event) { 
    $(this).parents(':eq(2)').draggable({ 
     disabled: false, 
     containment: "parent", 
     scroll: false, 
     cursor: "move", 
     delay: 200, 
     start: function (e, ui) { 
      remember = $(this).html(); 
      $(this).addClass('fantasma'); 
     }, 
     stop: function (e, ui) { 
      $(this).removeClass('fantasma'); 

      // **WHEN IS STOPPED IT MAY DISABLE THE DRAG** 
     } 


    <div id="llens"> 
     <div class="bloc professor" id="bloc_profes" style="top:40px; left:200px; width:800px; height:200px " data-actiu="true"></div> 
     <div class="bloc text" id="bloc_text" style="top:100px; left:200px; width:800px; height:100px " data-actiu="false"></div> 
     <div class="bloc alumne" id="bloc_alumnes" style="top:200px; left:200px; width:800px; height:200px " data-actiu="false"></div> 
    </div> 

DEMO: http://fiddle.jshell.net/blackersoul/47YvE/5/

Answer 1

Utilisez la méthode construite en destroy, comme ceci:

stop: function (e, ui) { 
      $(this).removeClass('fantasma').draggable('destroy'); 
     } 

La page de documentation est ici: http://api.jqueryui.com/draggable/#method-destroy

supprime complètement la fonctionnalité draggable. Cela retournera l'élément à son état de pré-initialisation.

Ici, il travaille: http://fiddle.jshell.net/47YvE/8/

Answer 2

Essayez de changer la classe des éléments pouvant être déplacées comme:

removeClass("draggable").addClass("static"); 

Vous pouvez également ajouter vérifier comme:

if(hasClass("draggable"){ 
removeClass("draggable").addClass("static")}