ExtJS的拖拽效果示例
更新時(shí)間：2013年12月09日 17:17:57 作者：
拖拽效果想必大家都有見到過(guò)吧，實(shí)現(xiàn)方式大同小異，在接下來(lái)的文章中為大家詳細(xì)介紹下使用ExtJS是如何做到的
復(fù)制代碼 代碼如下:
<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>
相關(guān)文章
extjs grid設(shè)置某列背景顏色和字體顏色的方法
extjs grid設(shè)置某列背景顏色和字體顏色的方法，需要的朋友可以參考下。2010-09-09
Extjs學(xué)習(xí)筆記之一 初識(shí)Extjs之MessageBox
去官網(wǎng)下載好extjs的壓縮包，解壓縮之后得到如下目錄結(jié)構(gòu)。2010-01-01
extjs中g(shù)rid中嵌入動(dòng)態(tài)combobox的應(yīng)用
今天需要在grid中嵌入combobox，在網(wǎng)上找了好久也沒(méi)有找到一個(gè)正確可行的方法，可能是版本問(wèn)題（我版本是extjs 3.0），沒(méi)有繼續(xù)研究其原因，自己查找資料，終于實(shí)現(xiàn)功能?，F(xiàn)在分享一下代碼。2011-01-01
ExtJS下書寫動(dòng)態(tài)生成的xml(兼容火狐)
ExtJS下書寫動(dòng)態(tài)生成的xml,只能有IE可以運(yùn)行，為了兼容性，必須考慮火狐的用戶，所以，這個(gè)程序?yàn)榱耍夯鸷脩舻募嫒菪?/div> 2013-04-04
異步調(diào)用不用做過(guò)多說(shuō)明，ext的api中支持的很多。2009-09-09
ExtJS的FieldSet的column列布局，需要的朋友可以參考下。2009-11-11
ExtJS下grid的一些屬性說(shuō)明2009-12-12
ExtJS 2.0 實(shí)用簡(jiǎn)明教程之布局概述
所謂布局就是指容器組件中子元素的分布、排列組合方式。Ext的所有容器組件都支持而局操作，每一個(gè)容器都會(huì)有一個(gè)對(duì)應(yīng)的布局，布局負(fù)責(zé)管理容器組件中子元素的排列、組合及渲染方式等。2009-04-04
ExtJS 2.0實(shí)用簡(jiǎn)明教程 之ExtJS版的Hello
下面我們寫一個(gè)最簡(jiǎn)單的ExtJS應(yīng)用，在hello.html文件中輸入下面的代碼2009-04-04
extjs實(shí)現(xiàn)選擇多表自定義查詢功能 前臺(tái)部分(ext源碼)
extjs實(shí)現(xiàn)選擇多表自定義查詢功能 前臺(tái)部分(ext源碼) ，需要的朋友可以參考下。2011-12-12最新評(píng)論