Перетаскивание, перетаскивание элементов между таблицами - PullRequest
Новая
       89

Перетаскивание, перетаскивание элементов между таблицами

0 голосов
/ 09 мая 2018

Представь, у меня есть это JsFiddle ç 

<table class="connectedtable">
  <tr id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">
    <td id="drag1" draggable="true" ondragstart="drag(event)" />10</td>
  </tr>
  <tr id="div2" ondrop="drop(event)" ondragover="allowDrop(event)">
    <td id="drag2" draggable="true" ondragstart="drag(event)" />20</td>
  </tr>
  <tr id="div3" ondrop="drop(event)" ondragover="allowDrop(event)">
    <td id="drag3" draggable="true" ondragstart="drag(event)" />30</td>
  </tr>
</table>
<table class="connectedtable">
  <tr id="div4" ondrop="drop(event)" ondragover="allowDrop(event)">
    <td id="drag4" draggable="true" ondragstart="drag(event)" />40</td>
  </tr>
  <tr id="div5" ondrop="drop(event)" ondragover="allowDrop(event)">
    <td id="drag5" draggable="true" ondragstart="drag(event)" />50</td>
  </tr>
  <tr id="div6" ondrop="drop(event)" ondragover="allowDrop(event)">
    <td id="drag6" draggable="true" ondragstart="drag(event)" />60</td>
  </tr>
</table>

<script>
function allowDrop(ev) {
    ev.preventDefault();
}

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

function drop(ev) {
    ev.preventDefault();
    var src = document.getElementById(ev.dataTransfer.getData("src"));
    var srcParent = src.parentNode;
    var tgt = ev.currentTarget.firstElementChild;

    ev.currentTarget.replaceChild(src, tgt);
    srcParent.appendChild(tgt);
}
</script>

Так что я пытаюсь перетащить, бросить и поменять местами эти две таблицы. Я был в состоянии перетаскивать между таблицами, используя jquery-ui, но мне не удалось сделать это подкачки.

Извините, если я не даю достаточно информации, я только начинающий. Спасибо!

...