jQuery déplaçable et appendTo ne fonctionne pas
J'utilise jQuery ui déplaçable, mais l'option appendTo ne fonctionne pas. Toutefois, d'autres l'option comme le confinement ou la grille de fonctionner correctement. Voici le code:
HTML
<div id="demo">
</div>
<div id="sidebar">
<div class="item">
</div>
<div class="item">
</div>
<div class="item">
</div>
<div class="item">
</div>
</div>
script
jQuery(".item").draggable({ appendTo: "#demo", grid: [ 10, 10 ], containment: "#demo" });
CSS
#demo {
width: 500px;
height: 500px;
border: 1px solid black;
float: left;
}
#draggable {
background: red;
width: 50px;
height: 50px;
}
#sidebar {
float: left;
width: 300px;
}
.item {
cursor: pointer;
background: black;
width: 100px;
height: 100px;
margin: 10px;
}
Voici une démonstration en direct: http://jsfiddle.net/fzjev/
OriginalL'auteur MatthewK | 2012-03-10
Vous devez vous connecter pour publier un commentaire.
voici un bug ouvert sur la question - Draggable: appendTo option ne fonctionne pas avec helper: "original".
La solution de contournement proposée est d'utiliser
helper: 'clone'
et cacher/afficher l'original glisser sur start/stop.par exemple
Vous aurez probablement souhaitez ensuite manuellement ajouter votre draggables sur
drop
d'undroppable
élément.Jquery Sortable fonctionne de la même manière, mais sortable est lancé sur l'élément conteneur de la sortable éléments, de sorte que vous pouvez utiliser
ui.item.hide()/show()
au lieu de$(this)
dans ce casOriginalL'auteur RYFN
Il ressemble pour le appendTo option pour être reconnu l'élément glissé doit être à l'extérieur du corps.
De jQuery UI 1.8.18 (autour de la ligne 275)
Dans votre exemple, si l'instruction est évaluée à faux, de sorte que le appendTo logique n'est pas déclenché.
Éclipsé ma réponse précédente (qui était vraiment plus d'une question) et mis à jour avec quelque chose de plus répondre. Je suis honnêtement pas sûr de savoir pourquoi il est mis en place comme il est, mais au moins nous savons ce qui se passe maintenant.
OriginalL'auteur Ian Robinson
Dans mon cas, beau travail ces exemple:
OriginalL'auteur lmcDevloper