嵌套的html5可拖动项

Question

我对html5可拖动项有疑问。 我一直在看这个例子：https://codepen.io/retrofuturistic/pen/tlbHE

如果我对其进行自定义并使其父母可拖动

<ul>
    <li draggable="true" class="parent-li">
        <ul id="columns-1">
            <li class="column child-li" draggable="true"><header>A</header></li>
            <li class="column child-li" draggable="true"><header>B</header></li>
        </ul>
    </li>
    <li draggable="true" class="parent-li">
        <ul id="columns-2" draggable="true">
            <li class="column child-li" draggable="true"><header>A</header></li>
            <li class="column child-li" draggable="true"><header>B</header></li>
        </ul>
    </li>
</ul>

事实证明，当您尝试对列表项“ child-li”进行排序时，它将尝试拖动“ parent-li”

this.parentNode.removeChild(dragSrcEl);

dragSrcEl与this.parentNode相同：“ parent-li”。

因此，只要列表项处于同一级别，是否可以对它们进行排序？

Answer 1

昨天很晚。我应该使用event.stopPropagation（）来防止在父元素上冒泡。