一、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')；//返回代理元素