EasyUI拖动组件实现拖拽效果
EasyUI是一个包的jqusey UI插件,但它仍然是非常好用的,至少,我喜欢这个渣用了很多时间。有两种方式加载可拖动:
1,通过类加载,如下所示:
通过js加载,如下所示:
$(#盒)Draggable();
两点要注意的是whether'easyui-draggable'or拖动固定。他们称,EasyUI写了功能实现效果的jQuery。
Draggable的特性:
当返回等价为true时,拖动返回到起始位置,并可拖动到周围。
返回:布尔,
轴极限阻力,方向level'h 'vertical'v '这是一个有趣的组合的回复,并拖动方向设置。
垂直的话是一样的微信、微博。
轴:字符串 / / H V,
代理克隆是拖动对象,同时拖动,然后复制鼠标拖动鼠标,当然,
可以是其他的,可以触发功能。
代理:空/字符串/函数,
然后还有很多其他的属性,并不觉得特别有趣。
游标:当指定的指针样式成为美国和美国时,移动/字符串,拖动。
Δx:空/数量,
deltay:空/数/ /拖动元素对应于当前光标位置的x,y是一个拖动元素和光标距离
句柄:空/选择器/句柄来处理拖动!只能用手柄拖动!对!
禁用:布尔值/真设置为第一个绑定元素,不能拖动
边缘:在其中,可以从容器下面拖动容器的宽度,就像在矩形内的矩形,然后只能在矩形元素内部的鼠标内部拖动。
实例uff1a
$(#盒({ Draggable)。
回复:真的,
光标:中,
手柄:#痘,
残疾人:假,
优势:50,
轴:V,
代理:'clone,
Δx:10,
deltay:10,
代理:函数(源){
console.log(哈!);
}
});
拖动事件:
onbeforedrag触发前拖,并返回错误将取消拖动
OnBeforeDrag:功能(e){
警报('trigger前拖);
返回false;
}
onstartdrag拖动触发
OnStartDrag:功能(e){
警报('trigger '当'拖');
}
阻力将被触发,并没有拖回假
OnDrag:功能(e){
警报('trigger过程触发的);
}
当拖动阻力触发停止
OnStopDrag:功能(e){
警报('triggering当拖动停止);
}
可拖动的方法清单
选项返回属性对象
console.log($(' #盒)。Draggable(选项));
代理设置代理属性时返回代理代理元素。
console.log($(' #箱),Draggable('proxy '));
可以拖动
$(#箱),Draggable('enable);
禁止禁止拖拉
$(#箱),Draggable('disable);
让我们看一个简单的例子。
基本可拖动- jQuery EasyUI演示
基本可拖动
通过点击鼠标移动下面的方框。
容器中的内容
$(函数(){())
$(#标题)。Draggable({
代理:函数(a){
var a = $(你帮我);
A.appendTo('body);
返回一个;
},
光标:'pointer,
优势:6
});
});
以上是关于EasyUI 1.2.5拖动所有的属性、事件、方法和实例,如果出了什么问题,欢迎评论,讨论和评论。