jQuery EasyUI可拖动组件使用方法.pdfVIP

第3章可拖动(拖动)组件

学习要点：

1.加载方式

2.属性列表

3.列表

4.方法列表

讲师：恢

本课由北风网城W

本节课重点了解EasyUI中Draggable（拖动）组件的使用方法，这个组件不依赖

于其他组件。

.加载方式

//类加载方式divid=box类=easyui‑draggable样式=

width:400px;height:200px;background:red;内容部分/div

//JS加载调用

$(#box).draggable();

.属性列表

Draggable属性

属性名值说明

null/当使用clone，则克隆一个替代元素拖动。

字符串、函数如果指定一个函数，则自定义替代元素。

revertfalse/布尔值设置为true，则拖动停止时返回起始位置

cursormove/string拖动时的CSS指针样式

deltaXnull/number被拖动的元素对应于当前光标位置x

deltaY空值/数字被拖动的元素对应于当前光标位置y

handle空值/选择器开始拖动的句柄

disabled假值/布尔值设置为true,则停止拖动

edge0/数字可以拖动的容器的宽度

axisnull/string设置拖动为垂直v，还是水平h

//属性设置

第章

3Draggable(拖动)组件

学习要点：

1.加载方式

2.属性列表

3.列表

4.方法列表

讲：恢

本课由北风网城W

本节课重点了解EasyUI中Draggable(拖动)组件的使用方法，这个组件不依赖于其

他组件。

．加载方式

//class加载方式

divid=boxclass=easyui-draggable

style=width:400px;height:200px;background:red;

内容部分

/div

//JS加载调用

$(#box).draggable();

．属列表

Draggable属性

属性名值说明

null/当使用clone，则克隆一个替代元素拖动。

string、function如果指定一个函数，则自定义替代元素。

revertfalse/boolean设置为true，则拖动停止时返回起始位置

cursormove/string拖动时的CSS指针样式

deltaXnull/number被拖动的元素对应于当前光标位置x

deltaYnull/number被拖动的元素对应于当前光标位置y

handlenull/sele