在 Dojo中实现拖动的效果需要用Dojo 所提供的标签属性标注出希望实现拖动的实体。简单的说，就是如果希望一个实体可以拖动，则只需要在这个实体的标签里面加上 dojoType=“dojo.dnd.Moveable”这个属性。例如要实现一个表格的拖动，则只需要在这个表格的声明标签“<table>”里加上 dojoType=“dojo.dnd.Moveable”这个属性。甚至就是在“<tr>”或“<td>”标签中加上 dojoType=“dojo.dnd.Moveable”，也可以实现对应实体的拖动效果。下面就是一个Dojo的拖动例子，代码如下：
<html>
<head>
<script type="text/javascript"
djConfig="parseOnLoad: true, isDebug: true"
src="dojoapp/dojo/dojo.js"></script>
</head>
<body>
<script type="text/javascript">
dojo.require("dojo.dnd.move"); //引入Dojo的拖动功能模块
dojo.require("dojo.parser"); //引入解析Dojo标记的功能模块
</script>
<table dojoType="dojo.dnd.Moveable">
<tbody>
<tr>
<td>
Dojo 的拖动效果
</td>
</tr>
</tbody>
</table>
</body>
</html>
需要注意的是静态创建可拖动实体需要引入 dojo.require("dojo.parser") 。
8.4.2 动态实现可拖动实体
在上面程序中，通过在一些实体的标签里面加上相应的 Dojo 标签属性来实现可拖动实体的创建。这种静态实现可拖动实体的方法简单明了。但是在更多的情况下，往往需要根据一些实际情况运行得到的数据来动态的创建可拖动实体。在这种情况下，静态实现可拖动实体的方法就不能满足当下的需求。所以 Dojo 对于所有静态实现的方法都对应有一套相应的动态实现方法。下面就是一个动态实现可拖动实体的例子，代码如下：
<html>
<head>
<script type="text/javascript"
djConfig="parseOnLoad: true, isDebug: true"
src="dojoapp/dojo/dojo.js"></script>
</head>
<body>
<script type="text/javascript">
dojo.require("dojo.dnd.move"); //引入Dojo的拖动功能模块
var m1;
var init = function() {
m1 = new dojo.dnd.Moveable("tb1", {});//申明 id 为 "tb1" 的实体为可拖动实体
};
dojo.addOnLoad(init);// 表示在页面加载完成以后，执行 init 函数
</script>
<table id="tb1" border="1">
<tbody>
<tr>
<td>
Dojo 的拖动效果
</td>
</tr>
</tbody>
</table>
</body>
</html>
Dojo 的拖动
最新推荐文章于 2020-10-21 04:20:34 发布
本文介绍了使用Dojo工具包实现元素拖动效果的两种方式：静态和动态创建可拖动实体。静态方法通过在HTML标签中添加特定属性实现，而动态方法则利用JavaScript代码在页面加载后指定元素为可拖动。
扫一扫
1720
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
