динамически добавленный div не перетаскивается

Question

Я пытаюсь сделать мои динамически добавленные div перетаскиваемыми, но если я позвоню после

$("#draggable").draggable({});

Этот

for( var i = 0; i < 5; i++ ){
  var smallone = document.createElement('div');
  smallone.id = "draggable";
  smallone.className = "smallDiv";
  smallone.style.bacgroundColor = 'blue';

  document.body.appendChild(smallone);
}

Нет никаких шансов сделать divs перетаскиваемым.
Я знаю, что это работает, если я сначала создаю div, но мне нужно сохранить это так из-за моего проекта, и этот пример показывает мою проблему.

Вот скрипка: http://jsfiddle.net/bimbochobot/9jstfwpm/4/

Спасибо за совет.

javascript jquery html jquery-ui

1

Petr Bečka 15 Дек 2015 в 15:29

Answer 1

Вам нужно будет initialize draggable виджет после добавления нового элемента.

Попробуйте эту скрипку:

for( var i = 0; i < 5; i++ )
  {
      var smallone = document.createElement('div');
      smallone.id = "draggable";
      smallone.className = "smallDiv";
      smallone.style.backgroundColor = 'blue';
      document.body.appendChild(smallone);      
      $(smallone).draggable({});
   }

1

Rayon 15 Дек 2015 в 12:32

Answer 2

Используйте класс вместо идентификатора, так как идентификатор должен быть уникальным

$(".draggable").draggable({});

Назначить перетаскиваемый класс всем div

0

Djave 15 Дек 2015 в 12:34

Answer 3

Просто 1 ...

for( var i = 0; i < 5; i++ )
{
  var smallone = document.createElement('div');
  smallone.id = "draggable";
  smallone.className = "smallDiv";
  smallone.style.bacgroundColor = 'blue';

  document.body.appendChild(smallone);
  $(".smallDiv").draggable({});
}

Это работает ... http://jsfiddle.net/9jstfwpm/7/

0

Divesh Oswal 15 Дек 2015 в 12:36

динамически добавленный div не перетаскивается

3 ответа

Похожие вопросы

Новые вопросы

javascript