Перетаскивание по требованию. Как включить, запустить и продолжить перетаскивание всего в одном событии mousedown?

Question

Перетаскивание по требованию. Как включить, запустить и продолжить перетаскивание всего в одном событии mousedown?

0

Поэтому у меня более 9000 элементов, каждый из которых должен быть перемещен. Кажется невозможным превратить каждый из них в draggable, применив плагин jQueryUI напрямую. Я думал о том, чтобы сделать элемент перетаскиваемым в ответ на событие мыши, прослушивая событие мыши вниз документа и проверяя, является ли цель события одним из элементов. Как только мышь на элементе произошла, я превращаю его в перетаскиваемое и в то же время заставляю его захватывать и перетаскивать уже так, чтобы перетаскивание продолжалось, как если бы эта мышь начиналась с перетаскивания. Как только перетаскивание завершено (либо путем отбрасывания, либо отмены), перетаскиваемый плагин уничтожается, и элемент возвращается в состояние несвязанного состояния. Таким образом можно перетаскивать только один элемент за раз, что делает это решение легким и масштабируемым.

Как я могу это сделать?

Aleksey Bykov 22 сен. 2013, в 05:09

Источник

Теги:

jquery

jquery-ui

drag-and-drop

jquery-ui-draggable

1 ответ

Ещё вопросы

tom · Accepted Answer · 2013-09-22T01-53-00.000Z

Это можно сделать, используя комбинацию trigger() и draggable("destroy"):

function downHandler(event)
{
    var target = $(event.target);
    target.off("mousedown", downHandler); // prevents infinite recursion
    target.on("mouseup", upHandler);
    target.draggable();
    target.trigger(event);
}

function upHandler(event)
{
    var target = $(event.target);
    target.draggable("destroy");
    target.off("mouseup", upHandler);
    target.on("mousedown", downHandler);
}

$(".draggable-on-mousedown").on("mousedown", downHandler);

Демо: http://jsfiddle.net/jPjKN/

Это аккуратно! Я не знал, что событие может быть обработано триггерным методом, подобным этому.
Магия! Оно работает! Огромное спасибо! Ты сделал мой день!