replaceWith et jQuery draggable drop?

Question

Je suis en train de comprendre pourquoi

$('#title').replaceWith('ha'); 

travaillera en dehors de la

drop: function(event, ui) {} 

zone

dans le script largable de jquery, mais il ne fonctionnera pas à l'intérieur. Plus précisément, si je

$(".droppable").droppable({ 
drop: function(event, ui) { 
    $('#title').replaceWith('ha'); 
    } 

je reçois un Runtime Error (line 1102) data(...).options is null or not an object. Aussi, si j'insère un $('#title').append('ha'); dans le drop :, ça marche. Toutefois, si je mets $('#title').replaceWith('ha'); nulle part ailleurs en dehors

$(".droppable").droppable({ /* */ }); 

ça marche?

Answer 1

Est-ce que l'élément avec id = « title » ont également class = « largable »

Je pouvais voir si elle tente d'enlever un élément qui provoquerait l'événement de chute se produise, il peut y avoir aucun élément plus à travailler avec et vous pourriez obtenir une erreur «pas un objet». Je ne sais pas avec certitude sans essayer moi-même. Peut-être que ce que vous pouvez faire est de marquer l'objet avec une classe fictive (les données de jQuery seraient plus appropriées et conformes à la SRP, mais cela sort du cadre de cette réponse), puis en dehors de la fonction de droppable vous pouvez faire le remplacement

quelque chose comme ...

$(".droppable").droppable({ 
    drop: function(event, ui) { 
     // mark the element for replacement 
     $('#title').addClass('replaceThisElement'); 
    } 
}); 

// outside of the drop function 
$('#title .removeThisElement').replaceWith('ha'); 

Answer 2

Je souhaite publier cela comme une réponse, mais vraiment ses plus d'un commentaire sur la réponse de Jon Erickson (je n'ai pas les points de réputation à commentaire encore). 18 mois plus tard, c'est toujours un bug dans IE et je voulais juste développer la partie 'comment faire quelque chose en dehors de la fonction drop' en suggérant setTimeout()

Je résous le problème en passant une fonction anonyme supprime l'élément à setTimeout(). En fonction de vos paramètres d'accrochage ou de réversion, vous pouvez également envisager de masquer le fichier déplaçable.

$(".droppable").droppable({ 
    drop: function(event, ui) { 
     // do something interesting here... 

     // now get rid of the draggable 
     $(ui.draggable).hide();   
     setTimeout(function(){$(ui.draggable).remove();}, 1); 
    } 
});