最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
ExtJS的拖拽效果示范
时间:2026-06-09 10:17:47 编辑:袖梨 来源:一聚教程网

复制代码 代码如下:
<html>
<head>
<title>hello</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<link rel="Stylesheet" type="text/css" href="http:10.19.1.55/lib/extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="http:10.19.1.55/lib/extjs/bootstrap.js"></script>
<script type="text/javascript" src="http:10.19.1.55/lib/extjs/locale/ext-lang-zh_CN.js"></script>
<style type="text/css">
</style>
<script type="text/javascript">
Ext.onReady(function(){
var drags=document.getElementsByTagName('li');
for(var i=0;i<drags.length;i++)
{
Ext.dd.Registry.register(drags[i]);
}
new Ext.dd.DragZone('today');
new Ext.dd.DragZone('tmrw');
function drop(dropNodeData,source,event,dragNodeData)
{
var dragged=source.dragData.ddel;
var sourceContainer=source.el.dom;
var desContainer=this.getEl();
sourceContainer.removeChild(dragged);
desContainer.appendChild(dragged);
return true;
}
var cfg={onNodeDrop:drop};
new Ext.dd.DropZone('today',cfg);
new Ext.dd.DropZone('tmrw',cfg);
})
</script>
</head>
<body>
<h1>Today</h1>
<ul id="today">
<li>shopping</li>
<li>haircut</li>
</ul>
<h1>Tomorrow</h1>
<ul id="tmrw">
<li>123</li>
<li>456</li>
</ul>
</body>
</html>
相关文章
- 萝卜快跑运营城市名单 - 2026年最新覆盖城市查询 06-12
- 小笼包的正宗做法与技巧 - 家庭版鲜香多汁小笼包制作指南 06-12
- 双十一广告语大全 - 2026热门创意文案参考 06-12
- 夸克电脑版下载安装 - 官方最新PC客户端 06-12
- ChatGPT引发的社会焦虑现象 - 2026年深度解析 06-12
- 网红城市有哪些 - 2026热门旅游打卡地推荐 06-12