Перемещение и Repalce ячейку с 2 DIV тегов в Javascript

Question

У меня есть следующая таблица

<table border='1'> 
 
      <tbody> 
 
       <tr> 
 
        <td class="cell" id="1,1" draggable="true"> 
 
         <div class="Name">A</div> 
 
         <div class="Number">l</div> 
 
        </td> 
 
        <td class="cell" id="1,2" draggable="true"> 
 
         <div class="Name">B</div> 
 
         <div class="Number">10</div> 
 
        </td> 
 
        </tr> 
 
       </tbody> 
 
    </table>

То, что я хочу сделать, это быть в состоянии переместить две Div метки, которые находятся внутри ячейку в другую ячейку, заменяющую теги div, которые ранее были там. Я хочу сделать это таким образом, чтобы я мог добавить анимацию в движение в будущем.

Что было бы лучшим способом сделать это?

Answer 1

Чтобы переместиться между двумя списками, лучше использовать следующую ссылку. Проверьте это даст вам простой способ для достижения перетаскиваемых списков

Demo

Answer 2

что-то вроде этого? - https://jsfiddle.net/ss9au2k9/1/

В основном вам нужно играть с dragstart, dragover и dragleave событиями.

Я также обернул содержимое внутренней ячейки в элементе <div> и добавил некоторые классы CSS.