知道哪个div是Sortable.js的目标

问题描述

在10个li元素的列表中，我正在通过Sortable.js对列表进行排序。但是我需要拖放的li放在的项目的ID。我怎么得到的？

解决方法

我使用 SortableJs 对同一类别列表中的项目进行排序，但也能够将项目从一个类别列表移动到另一个类别列表，反之亦然。

不确定这是否是您要查找的内容，但这是我获取目标容器（列表）ID 的方式。

• event.oldIndex 是项目的原始位置。
• event.from 是项目的原始容器元素（例如 ul 标签）
• event.newIndex 是项目的最终位置。
• event.to 是项目的最终容器元素（例如 ul 标签）

也就是说你可以做这样的事情：

/* If position did not change neither the containing list */
if (event.oldIndex === event.newIndex && event.from === event.to) { return; }

/* If position changed within the same category */
if (event.oldIndex !== event.newIndex) {
  const newPosition = event.newIndex
}

/* If product was moved to another category list */
if (event.from !== event.to) {
  /* Accessing `<ul data-id="10">` */
  const categoryId = event.to.dataset.id;
  /* Accessing `<ul id="list_on_the_right_11">` */
  const elementId = event.to.id;
}

希望它可以在某种程度上有所帮助。