JQueryeasyui(2)Droppable(放置)组件

王朝学院·作者佚名  2016-08-27  
宽屏版  字体: |||超大  

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

Droppable的加载方式

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

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

2,js 加载调用

$("#box").droppable({

accept:'#pox',//将元素pox 放置在元素box中});

Droppable的属性

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

$("#box").droppable({

accept:'#pox',//将元素pox 放置在元素box中});

2,deisabled默认为false 如果为true,则禁止放置

$("#box").droppable({

accept:'#pox',//将元素pox 放置在元素box中disabled :true,//禁止放置});

Droppable 事件列表

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

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

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

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

1onDragEnter /onDragOver/onDragLeave/onDrop: function (e,source){2//source 参数获取DOM元素3}

Droppable 方法列表

1,options 返回属性对象

console.log($('#box').droppable('options'));

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

$('#box').droppable('enable/disable')

easyui 1.3.5 Droppable 就此完结。

看PDF的时候觉得特别不对劲,原来是PDF错字了,真心坑 - -

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
© 2005- 王朝网络 版权所有