• 设为首页
  • 收藏本站
  • 积分充值
  • VIP赞助
  • 手机版
  • 微博
  • 微信
    微信公众号 添加方式:
    1:搜索微信号(888888
    2:扫描左侧二维码
  • 快捷导航
    福建二哥 门户 查看主题

    ExtJS的拖拽效果示例

    发布者: 福建二哥 | 发布时间: 2025-8-13 18:38| 查看数: 57| 评论数: 0|帖子模式

    <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);
    }
    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>

    来源:互联网
    免责声明:如果侵犯了您的权益,请联系站长(1277306191@qq.com),我们会及时删除侵权内容,谢谢合作!

    最新评论

    QQ Archiver 手机版 小黑屋 福建二哥 ( 闽ICP备2022004717号|闽公网安备35052402000345号 )

    Powered by Discuz! X3.5 © 2001-2023

    快速回复 返回顶部 返回列表