easyuiDroppable组件实现放置特效

所谓放置，就是将一个物体放入一个物体内，当然对于easyui来说触发各种效果是必不可少的，同时这个组件也不会依赖于其他组件。

Droppable的加载方式

1,class 加载 一直不太喜欢class方式的加载 浪费一个位置，代码一多还看着乱七八糟的。

代码如下:

<p id='dd' class="easyui-droppable" data-options="accept:'#box,#pox'"></p>

2,js 加载调用

Droppable的属性

1,accept 　　　　

默认为null,确定哪些元素被接受，也就是那个元素能被放置

2，deisabled　　

默认为false 如果为true，则禁止放置

Droppable 事件列表

　　1,onDragEnter 在被拖拽元素到放置区域内的时候触发

　　2,onDragOver 在被拖拽元素经过放置区域的时候触发

　　3,onDragLeave 在被拖拽元素离开放置区域的时候触发

　　4,onDrop 在被拖拽元素放入到放置区的时候触发

Droppable 方法列表

1，options 返回属性对象

2,enable,disable 和上面属性的功能是一样的 分别是启用和禁止放置

给大家展示下官方的示例吧

运行效果图这里就不给出了,官网直接就可以查看。OVER!

效果地址: http://www.jeasyui.com/demo/main/index.php?plugin=Droppable&theme=default&dir=ltr&pitem=

以上就是本章的全部内容，更多相关教程请访问jQuery视频教程，jQuery EasyUI视频教程！