Как автоматически применить эффект перетаскивания к динамически добавленному элементу?

Question

Я использую jquery ui для применения эффекта перетаскивания на серию DIV, например:

<div class="draggable">...</div>
<div class="draggable">...</div>
<div class="draggable">...</div>
<div class="draggable"> this DIV was dynamically added, not draggable </div>

Проблема в том, что динамически добавленные DIV не будут применять этот эффект. Как я могу применить этот эффект и к новым членам?

Answer 1

Вы не можете использовать функцию .live () непосредственно с .draggable (), но вы можете использовать .live () с событием mouseover и повторно присоединить .draggable () к mouseover, как это.

$('.draggable').live('mouseover',function(){
    $(this).draggable();
});

Answer 2

Вы также можете получить награду за метод делегат () , представленный в jQuery 1.4, который немного лучше, чем live ()

Вот статья, сравнивающая оба подхода - http://net.tutsplus.com/tutorials/javascript-ajax/quick-tip-the-difference-between-live-and-delegate/

Answer 3

Посмотрите на jQuery .live () . Я полагаю, вы могли бы использовать это здесь. Если нет - просто прикрепите .draggable() при создании элемента.