一、class加载方式
<div >
内容部分
</div>
二、js加载
$("#box").draggable({}）
三、关于draggable的属性、事件、方法
$("#box").draggable({
//属性
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')；//返回代理元素