JQuery UI提供的API极大简化了拖拽功能的开发。只需要分别在拖拽源(source)和目标(target)上调用draggable和droppable两个函数即可。 [b]拖拽原理[/b] 首先要明确几个概念。 　　ource：拖拽源，要拖动的元素。 　　taerget：拖放目标，能够放入source的容器。 拖拽的动作分解如下： 　　1. drag start：在拖拽源(source)上按下鼠标并开始移动 　　2. drag move: 移动过程中 　　3. drag enter: 移动进入目标(target)容器 　　4. drag leave: 移出目标(target)容器 　　5. drop: 在目标(target)容器上释放鼠标 　　6. drag end: 结束 在html5之前，页面元素不直接支持拖拽事件。所以都是通过监听鼠标事件并记录拖拽状态的方式来实现拖拽功能。 [b]最简单的例子[/b] 最简单的拖拽是不改变元素所在的容器，而只改变其位置。例子如下：