Изменить порядок элементов списка с помощью перетаскиванияHtml

Программисты Html
Ответить
Anonymous
 Изменить порядок элементов списка с помощью перетаскивания

Сообщение Anonymous »

Я использовал следующие html и ts для перетаскивания элементов списка из одного div в другой Div. < /p>

html: < /p>
< Br />

Drag and Drop list in Green Area:

  • i am list 1
  • i am list 2
  • i am list 3
  • i am list 4

Drop Here

< /code>

и TypeScript содержит следующее: < /p>

allowDrop(ev) {
ev.preventDefault();
}

drag(ev) {
ev.dataTransfer.setData("text", ev.target.id);
}

drop(ev) {
ev.preventDefault();
var data = ev.dataTransfer.getData("text");
ev.target.appendChild(document.getElementById(data).cloneNode(true));
}
< /code>

Это от html5 drag and drop, и я могу перетаскивать элементы списка из Div с Listarea в Div с классом Buildarea. < /p>

после отброса элементов списка Пользователь может изменить порядок элементов списка, которые были отброшены в Buildarea div. < /p>

Например, например, Указанный заказ, который я перечисляю, 1,2,3,4,5 может измениться на любой заказ, например, 2,4,5,3,1 или чем угодно. На данный момент я использовал только Angular и TypeScript, и не было добавлено сторонний плагин, и мне также нужен результат без каких -либо сторонних или jQuery. < /Strong> < /p>

Я также посмотрел на это, но не смог получить правильное решение и, следовательно, любезно помог мне достичь изменения порядка в списке сброшенного. < /p>

< Strong> Stackblitz
был>

Подробнее здесь: https://stackoverflow.com/questions/521 ... g-and-drop
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Html»