关于二级目录拖拽排序的实现(源码示例下载)

首先，需要先说明一下什么是二级目录拖拽排序。这是指在一个树形结构的目录中，除了根节点之外还有一层节点，这些节点是可以拖拽进行排序的。

在实现二级目录拖拽排序时，需要注意以下几点：

1. 确定数据结构

需要确定存储每个节点数据的数据结构，常见的是使用树形结构（包含根节点和子节点）或者数组结构（将每个节点的父子关系以及排序位置都存储在一个数据对象中）。

1. 使用拖拽事件

需要监听鼠标的拖拽事件，常见的有mousedown、mousemove、mouseup事件，也可以使用HTML5新增的dragstart、dragenter、dragover、dragleave、drop等事件。

1. 更新节点位置

当一个节点被拖拽到另外一个节点时，需要更新其在数据结构中的位置（父子关系和排序位置），并且将更新后的数据重新渲染到页面上。

在实现二级目录拖拽排序时，可以参考以下示例说明：

示例1：使用树形结构存储数据

在这个示例中，我们使用树形结构存储数据，每个节点包含id、name、children属性。具体实现过程如下：

• 使用ul和li标签展示树形结构；
• 添加mousedown、mousemove、mouseup事件监听；
• 在mousedown事件中，记录被拖拽节点的id，并且添加一个class属性，用于改变其显示样式；
• 在mousemove事件中，根据鼠标拖拽的位置更新节点显示的位置；
• 在mouseup事件中，获取拖拽的目标节点id，更新被拖拽节点和目标节点在数据结构中的位置，并且重新渲染整个树形结构。

示例2：使用数组结构存储数据

在这个示例中，我们使用数组结构存储数据，每个节点包含id、name、parentId、order属性。具体实现过程如下：

• 使用ul和li标签展示数组结构的树形结构；
• 使用jqueryUI的sortable插件进行拖拽排序；
• 在移动节点的过程中，根据节点在页面上的位置和其父节点的id在数据结构中的位置来计算其新的order属性；
• 在drop事件中，根据原树形结构和sortable插件自动生成的新排序结果来更新整个数组的排序；
• 在更新数据之后，重新渲染整个树形结构。

以上示例只是二级目录拖拽排序的两个简单实现，实际上在具体应用中的实现方式可能会更加复杂，需要根据实际情况进行调整。而对于初学者来说，可以借鉴以上示例的思路，逐步实现自己的需求。