使用Draggable元素需要拖动到指定的元素,那这儿需要使用到Droppable可放置插件

Droppable可放置有2种实现方式:

第一种 通过标记实现Droppable可放置区域

<divclass="easyui-droppable"data-options="accept:'#d1,#d2'"></div><divid="d1"></div><divid="d2"></div><divid="d3"></div>

class="easyui-droppable" 指定可放置区域 data-options="accept:'#d1,#d2'" 能被放置的模块:d1和d2可以 d3不能放到这个区域


第二种 通过javascript实现Droppable可放置区域

先定义一个div

<divid="dd"></div>

在使用javascript创建

$('#dd').droppable({accept:'#d1,#d2',disabled:true//设置为true停止可拖放});

accept 确定将被接受的可拖动元素


事件:

NameParametersDescriptiononDragEntere,source可拖动元素被拖进来触发onDragOvere,source可拖动元素被拖过时触发onDragLeavee,source可拖动元素被拖离开时触发onDrope,source可拖动元素被拖放下触发