Jquery сортируемый, удалить текущий элемент путем перетаскивания

Question

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

Мой код

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

        });

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

Answer 1

Используйте 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, но больше не могу найти ссылку. Поэтому я прошу прощения за то, что не ссылался на источник.)

Answer 2

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

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

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

Answer 3

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

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

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

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

Answer 4

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