掌握 Dojo 工具包，第 4 部分: Dojo 中的拖拽

Dojo 支持的两种拖拽方式

在开始尝试了解实现 Dojo 拖拽效果的使用方法以前，首先必须明确拖拽具有两种截然不同的表现效果。

第一种表现效果是图标被拖拽到哪里，其就会被直接放到哪里，这个拖拽效果是图标完全紧跟拖拽的动作，与每一个拖拽动作的运动轨迹完全契合，这种效果被称为 “拖动”。第二种表现效果是当图标被拖拽到一个地方，松开鼠标的时候，图标会以当前位置为基础而以其它图标为参照系进行位置的自动调整。这种效果被称为 “拖放”。

Dojo 的拖动

“拖动”与“拖放”相比较，原理更加容易理解，使用更加简单。而且更加贴近于人们直观印象中的“拖拽”效果。

最简单的拖动实例

要在 Dojo 的支持下，实现拖动的效果所需要的只是使用 Dojo 所提供的 Dojo 标签属性标注出希望实现拖动效果的实体。简单的说，就是如果希望一个实体可以拖动，则只需要在这个实体的标签里面加上 dojoType=“dojo.dnd.Moveable”这个属性。例如要实现一个表格的拖动，则只需要在这个表格的声明标签“<table& gt;”里加上 dojoType=“dojo.dnd.Moveable”这个属性。甚至就是在“<tr>”或“<td>”标签中加上 dojoType=“dojo.dnd.Moveable”，也可以实现对应实体的拖动效果。

清单 1

<script　type="text/javascript">　
dojo.require("dojo.dnd.move");　//引入Dojo的拖动功能模块　
dojo.require("dojo.parser");　//引入解析Dojo标记的功能模块　
</script>　
　
<table　dojoType="dojo.dnd.Moveable">　
<tbody><tr><td>Haha,　I　am　a　good　guy.</td></tr></tbody>　
</table>　
<!--引入dojoType="dojo.dnd.Moveable"，让上面的表格可以拖动-->