一、class加载方式
<div id="box" class="easyui-draggable" style="width:400px;height:200px;background:red">
内容部分
</div>
二、js加载
$("#box").draggable({}）
三、关于draggable的属性、事件、方法
$("#box").draggable({
//属性
revert:true, //设置为 true，则拖动停止时返回起始位置,默认为false
cursor : ‘move‘,//拖动时的 CSS 指针样式 move/pointer/text/wait等 默认为move
handle:‘#pos‘ //开始拖动的句柄 值为选择器 默认为null
disabled : true, //设为true停止拖动 默认为false
edge : 50, //可以在其中拖动的容器的宽度 值为number 默认为0
axis:"v" //设置拖动为垂直‘v‘，还是水平‘h‘ 默认为null
deltaX : 10, // 被拖动的元素对应于当前光标位置 x 值为number 默认为null
deltaY : 10, // 被拖动的元素对应于当前光标位置 y 值为number 默认为null
proxy: ‘clone‘,
proxy: function(source){}, //当使用‘clone‘，则克隆一个替代元素拖动。 如果指定一个函数，则自定义替代元素。
//事件
onBeforeDrag : function (e) { alert(‘拖动之前触发！‘); //return false; }, 返回 false 将取消拖动
onStartDrag : function (e) { alert(‘拖动时触发！‘); },
onDrag : function (e) { alert(‘拖动过程中触发！‘); }, 不能拖动时返回 false
onStopDrag : function (e) { alert(‘在拖动停止时触发！‘),
onStartDrag : function (e) { console.log($(‘#box‘).draggable(‘proxy‘)); }, //返回代理元素需和 proxy: ‘clone‘一起使用,可输出其代理元素
});
//方法
console.log($(‘#box‘).draggable(‘options‘)); //返回属性对象
$(‘#box‘).draggable(‘disable‘); //禁止拖动
$(‘#box‘).draggable(‘enable‘); //允许拖放
$(‘#box‘).draggable(‘proxy‘)；//返回代理元素
原文地址：https://www.cnblogs.com/Alaic2052243080/p/11427215.html