jQuery draggable, evento quando viene rilasciato all'esterno del genitore

Question

Ho una lista di foto, e ho aggiunto a loro il trascinamento, tuttavia quando la foto viene trascinata al di fuori del div genitore, voglio cambiare la sua classe in modo che indichi che se lo si rilascia, verrà rimosso e, quindi, quando l'utente lo rilascia, desidero attivare una funzione. (Solo se è al di fuori del div genitore)

<ul class="photos"> 
<li><img src=""/></li> 
<li><img src=""/></li> 
</ul> 

in modo che quando un li viene trascinato al di fuori di .photos, spara per aggiungere classe e quindi se è caduto al di fuori di esso, allora incendi e evento per rimuoverla.

Answer 1

Supponendo che il genitore div si parla è un droppable, è possibile associare un gestore di eventi per l'evento dropout:

$("#parentDiv").on("dropout", function(event, ui) { 
    //ui.draggable refers to the draggable 
}); 

L'evento sarà sparare ogni volta che un accettato trascinabili viene trascinato fuori dell'area di tolleranza del droppable .

Aggiornamento (vedi commenti)

È in grado di fornire una funzione di callback per l'opzione revert. La funzione può prendere un argomento che contiene sia il droppable sul quale viene rilasciato il trascinabile, o false (se fosse caduto da qualche parte non valido):

$("#draggable").draggable({ 
    revert: function(valid) { 
     if(!valid) { 
      //Dropped outside of valid droppable 
     } 
    } 
}); 

Ecco un working example.