Моя проблема: Сортируемое событие: срабатывает, когда я перетаскиваю что-либо в списке или сортирую список. Но я хочу запустить функцию, только когда перетаскиваю элемент.

Мой код

        $(document).ready(function ust()
        {    
            $('#div1').sortable({
                out: function(event, ui) { $('#nfo').append('OUT<br />'); }
            });

        });

Рабочий пример http://jsfiddle.net/FrbW8/22/

23
Peter 31 Июл 2010 в 10:51

4 ответа

Лучший ответ

Это поведение по умолчанию для обратного вызова. Посмотрите этот jquery пользовательский интерфейс trac ticket

Я действительно не согласен с понятием «логического» поведения.

«Тем не менее, обратите внимание, что обратный вызов« out »будет по-прежнему срабатывать, если вы перетаскиваете в список, а затем отпускаете мышь (но не в том случае, если вы не находитесь над списком). Это логичное поведение, которое также происходит для обычных сортируемых объектов. "

4
redsquare 31 Июл 2010 в 07:13

Используйте beforeStop, чтобы перехватить элемент и удалить его:

receive: function(e, ui) { sortableIn = 1; },
over: function(e, ui) { sortableIn = 1; },
out: function(e, ui) { sortableIn = 0; },
beforeStop: function(e, ui) {
   if (sortableIn == 0) { 
      ui.item.remove(); 
   } 
}

(Первоначально я нашел это в Google, но больше не могу найти ссылку. Поэтому я прошу прощения за то, что не ссылался на источник.)

37
Michael Finger 9 Дек 2010 в 15:45

Похоже, что другие решения не работают с подключаемыми сортируемыми списками, поэтому я публикую свое собственное решение, которое идеально подходит для моего случая. Это использует плагин «droppable», фиксирующий событие «drop», когда элементы удаляются за пределами сортируемых списков.

$('#div1').sortable({
    ....
}).droppable({greedy: true})

$('body').droppable({
    drop: function ( event, ui ) {          
        ui.draggable.remove();
    }
});

Вот пример этого подхода в действии: http://jsfiddle.net/n3pjL/

3
guilleva 30 Янв 2014 в 00:37

Я использую this.element.find('.ui-sortable-helper').length, чтобы сделать различие между «событием сортировки» и «событием выпадения». При сортировке отсортированный элемент имеет класс ui-sortable-helper. После удаления нет другого ui-sortable-класса, пока вы не начнете сортировку снова (по крайней мере, в моем скрипте). Надеюсь помочь кому-нибудь.

1
Newman 8 Фев 2015 в 16:59