Warum hat das Draggable-Objekt einen langsamen Platzhalter?

Sie haben das Recht, wenn Sie ein leeres <li></li> innerhalb des Sortable-Objekts hinzufügen, das das Problem behebt.

Ich denke, dass es eine praktikable Lösung ist, aus irgendeinem Grund benötigt das sortable-Objekt nur ein sort-fähiges Element, wenn das sort-fähige initialisiert wird. Ich glaube, das Herz der Antwort ist das: The sortable needs to know what kind of elements it is going to be sorting when initialized in order for the placeholder to work properly. Therefore if you are going to be sorting li elements, you should initialize the sorter with at least 1 li element in the Sortable object.

Ich glaube, dass dies der Fall ist, weil ich versucht habe, die leeren <li> durch zu ersetzen und <div> zu leeren, und das hat das Problem nicht behoben.

Ihre Lösung hat derzeit nur zwei kleinere Probleme. Das leere <li> wird beim Ziehen des ziehbaren Objekts weiterhin berücksichtigt. Sie können sehen, dass der Ziehbare nach links und rechts von empty li sortieren kann, was irgendwie komisch aussieht. Sie können auch empty li ziehen, was zu Verwirrung führen kann.

Aber zum Glück ist die Arbeit dafür sehr einfach. Das li muss nur im Sortierbar sein, wenn es initialisiert ist. Wir können es nachher entfernen und alles funktioniert super!

HTML - sortierbar mit li element.

jQuery

FIDDLE

Ich nehme an, die Handler von "Draggable" sind noch angeschlossen und stimmen nicht mit dem "Sortierbar" -Handler überein, der klickt. Das verursacht den Mangel an Reaktionsfähigkeit.

Löschen Sie die Handler, nachdem sie in Sortable eingefügt wurden, oder klonen / erstellen Sie das DOM-Element ganz neu - vielleicht indem Sie die innerHtml in ein neues DOM-Element oder dergleichen kopieren.

In meinem Fall kam das Problem auf, wenn das Sortierbar ein Flexbox Container war.

Es spielt keine Rolle, ob die Sortierung mit Elementen gefüllt ist oder nicht, unabhängig davon, ob es sich um <div> , <li> oder <something-else> handelt.

Beispiel: Ссылка

jQuery UI Problemverfolgung

Es stellt sich heraus, dass es im jQuery UI Forum bereits geöffnete Fehlerberichte gibt, die sich auf die Verwendung von flexbox in sortables beziehen: Ссылка

Leider konnte ich kein neues Ссылка erstellen: (

Hey, jeder von jQuery UI-Team, wenn Sie dies lesen, erklären Sie bitte, warum Sie immer noch dieses hässliche Forum aus den 90er Jahren anstelle von GitHub Issues verwenden?

Dieses Problem ist sehr ärgerlich, da wir überall Flexbox-Elemente haben

Problemumgehung

Ja, es gibt einen hässlichen, schmutzigen Workaround:

Ссылка

Verbinden Sie Zugobjekte nie mit Sortiern, es sei denn, das Problem wird vom jQuery-UI-Team gelöst, oder jemand leistet einen Beitrag und macht eine Pull-Anforderung.

Auch wenn Sie ein einzelnes ziehbares Objekt haben, wickeln Sie es mit div ein, initialisieren Sie es als sortierbar und verbinden Sie dieses div mit anderen Sortiern. Es verhält sich wie ziehbar und funktioniert ohne Probleme.

Buggy jQuery UI Sortierbar

Leider ist nach ein paar Umherziehern zwischen den Sorables ein neues Problem entstanden, siehe das Bild.

Also muss ich meine Problemumgehung neu formulieren: Verwenden Sie nicht jQuery UI Sortable mit Flexbox Containern. Nun, es gibt einen Klud, fügen Sie einfach dieses schreckliche Stück sh * t den Optionen des sortierbaren hinzu:

Mit anderen Worten, bereinigen Sie das sh * t nach dem

Beispiel: Ссылка

Im Ernst, Zeit, um alternative Bibliothek zu suchen, anstatt diesen veralteten Mist zu benutzen.