//class 加载方式
<div id="dd"class="easyui-droppable"data-options="accept:'#box,#pox'"style="background:black;width:600px;height:400px;">
</div>

//JS 加载调用
$('#box').droppable({accept:'#box,#pox',
});

/**
<div id="fzh">放置</div><div id="box"><div id="pox">内容部分</div>
</div>**/$(function () {$('#box').draggable({    //将box元素设置拖拽
});$('#fzh').droppable({    //将fzh元素设置成放置accept:'#box,#pox'   //确定哪些元素被接受，值为要接收放置的元素id
    })
});

/**
<div id="fzh">放置</div><div id="box"><div id="pox">内容部分</div>
</div>**/$(function () {$('#box').draggable({    //将box元素设置拖拽
});$('#fzh').droppable({     //将fzh元素设置成放置accept:'#box,#pox',   //确定哪些元素被接受，值为要接收放置的元素iddisabled:true         //如果为 true，则禁止放置
    })
});

/**
<div id="fzh">放置</div><div id="box"><div id="pox">内容部分</div>
</div>**/$(function () {$('#box').draggable({    //将box元素设置拖拽
});$('#fzh').droppable({     //将fzh元素设置成放置accept: '#box,#pox',   //确定哪些元素被接受，值为要接收放置的元素idonDragEnter: function (e, source) {       //在被拖拽元素到放置区内的时候触发，只触发一次$(this).css('background', 'blue');}})
});

/**
<div id="fzh">放置</div><div id="box"><div id="pox">内容部分</div>
</div>**/$(function () {$('#box').draggable({    //将box元素设置拖拽
});$('#fzh').droppable({     //将fzh元素设置成放置accept: '#box,#pox',   //确定哪些元素被接受，值为要接收放置的元素idonDragEnter: function (e, source) {       //在被拖拽元素经过放置区的时候触发，触发多次$(this).css('background', 'blue');}})
});

/**
<div id="fzh">放置</div><div id="box"><div id="pox">内容部分</div>
</div>**/$(function () {$('#box').draggable({    //将box元素设置拖拽
});$('#fzh').droppable({     //将fzh元素设置成放置accept: '#box,#pox',   //确定哪些元素被接受，值为要接收放置的元素idonDragLeave: function (e, source) {       //在被拖拽元素离开放置区的时候触发，$(this).css('background', 'blue');}})
});

/**
<div id="fzh">放置</div><div id="box"><div id="pox">内容部分</div>
</div>**/$(function () {$('#box').draggable({    //将box元素设置拖拽
});$('#fzh').droppable({     //将fzh元素设置成放置accept: '#box,#pox',   //确定哪些元素被接受，值为要接收放置的元素idonDrop: function (e, source) {       //在被拖拽元素放入到放置区的时候触发，也就是放下鼠标左键弹起时触发$(this).css('background', 'blue');}})
});

/**
<div id="fzh">放置</div><div id="box"><div id="pox">内容部分</div>
</div>**/$(function () {$('#box').draggable({    //将box元素设置拖拽
});$('#fzh').droppable({     //将fzh元素设置成放置accept: '#box,#pox',   //确定哪些元素被接受，值为要接收放置的元素idonDrop: function (e, source) {       //在被拖拽元素放入到放置区的时候触发，也就是放下鼠标左键弹起时触发$(this).css('background', 'blue');}});var p = $('#fzh').droppable('options');   //options  none 返回属性对象$.each(p, function (attr, value) {        //遍历属性对象alert(attr + ':' + value);});
});

/**
<div id="fzh">放置</div><div id="box"><div id="pox">内容部分</div>
</div>**/$(function () {$('#box').draggable({    //将box元素设置拖拽
});$('#fzh').droppable({     //将fzh元素设置成放置accept: '#box,#pox',   //确定哪些元素被接受，值为要接收放置的元素idonDrop: function (e, source) {       //在被拖拽元素放入到放置区的时候触发，也就是放下鼠标左键弹起时触发$(this).css('background', 'blue');}});$('#fzh').droppable('disable');  //disable  none$('#fzh').droppable('enable');  //enable  none 启用放置功能
});

/**
<div id="fzh">放置</div><div id="box"><div id="pox">内容部分</div>
</div>**/$(function () {$('#box').draggable({    //将box元素设置拖拽
});$('#fzh').droppable({     //将fzh元素设置成放置accept: '#box,#pox',   //确定哪些元素被接受，值为要接收放置的元素idonDrop: function (e, source) {       //在被拖拽元素放入到放置区的时候触发，也就是放下鼠标左键弹起时触发$(this).css('background', 'blue');}});$('#fzh').droppable('disable');  //disable  none 禁用放置功能
});

$.fn.droppable.defaults.disabled = true;