jQuery EasyUI使用教程之基本的拖放

<jQuery EasyUI最新版下载>html

本教程将为你展现如何使HTML元素可拖动。在这个示例中咱们将建立3个DIV元素,而后使它们可以被拖动。jquery

jQuery EasyUI使用教程:基本的拖放

查看演示app

首先,咱们建立3个div元素:svn

< div id = "dd1" class = "dd-demo" ></ div >
< div id = "dd2" class = "dd-demo" ></ div >
< div id = "dd3" class = "dd-demo" ></ div >

对于第一个div元素,咱们能够经过默认设置使其可拖动。ui

$('#dd1').draggable();google

对于第二个div元素,咱们能够经过建立一个复制原始元素的代理使其可拖动。spa

$( '#dd2' ).draggable({
proxy: 'clone'
});

对于第三个div元素,咱们能够经过建立一个自定义的代理使其可拖动。代理

$( '#dd3' ).draggable({
proxy: function (source){
var p = $( '<div class="proxy">proxy</div>' );
p.appendTo( 'body' );
return p;
}
});

下载该EasyUI示例:easyui-dnd-demo.zipcode

有兴趣的朋友能够点击查看更多有关jQuery EasyUI的文章orm

相关文章
相关标签/搜索