Как использовать сортировку jQuery для изменения порядка дочерних объектов сортируемого родителя

Question

Как использовать сортировку jQuery для изменения порядка дочерних объектов сортируемого родителя

0

У меня есть следующая структура HTML:

<div id='tiles'>

    <div class='slot'>
         <span class='slotNum'>1</span>
         <div class='tile'></div>
    </div>   

    <div class='slot'>
         <span class='slotNum'>2</span>
         <div class='tile'></div>
    </div>    

    <div class='slot'>
        <span class='slotNum'>3</span>
        <div class='tile'></div>
    </div>    

</div>

Я хочу, чтобы иметь возможность изменять порядок между слотами. Если я начну перетаскивать плитку под # 1 на плитку # 2, я хочу, чтобы плитка №2 переместилась под # 1. Если вы попробуете JSFiddle, плитка №2 в настоящее время просто складывается под переупорядоченным плиткой.

JSFiddle

smstromb 03 окт. 2013, в 01:07

Источник

1

Это демонстрирует сортировку плиток без перемещения чисел: jsfiddle.net/uBFtr/6 . Проблема здесь в вашей HTML-структуре, вы увидите, что я ее сильно изменил. Если вы хотите, чтобы числа перемещались вместе с плитками, то ответ betatester07 - путь.
Joe 02 окт. 2013, в 22:34

Теги:

jquery

jquery-ui

jquery-ui-sortable

1 ответ

Ещё вопросы

Это демонстрирует сортировку плиток без перемещения чисел: jsfiddle.net/uBFtr/6 . Проблема здесь в вашей HTML-структуре, вы увидите, что я ее сильно изменил. Если вы хотите, чтобы числа перемещались вместе с плитками, то ответ betatester07 - путь.

betatester07 · Answer 1 · 2013-10-02T21-11-00.000Z

вы неправильно настроили элементы - я думаю, что в вашем примере он должен быть установлен на.slot, а не на.tile.

$( "#tiles" ).sortable({ 
    items: ".slot",
});

http://jsfiddle.net/uBFtr/5/

По умолчанию для параметра items установлено значение > * selector, что означает любой дочерний элемент (а не subchild), поэтому нет необходимости указывать его вообще в вашем примере.

извини, я не понял, что ты не хочешь двигать числа. см. комментарий Джо