轻松学习jQuery插件EasyUI EasyUI实现拖动基本操作(jquery插件是干什么的)

推荐整理分享轻松学习jQuery插件EasyUI EasyUI实现拖动基本操作(jquery插件是干什么的)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:jquery 插件写法,简单的jquery插件实例,jquery插件大全,jquery插件怎么写,简单的jquery插件实例,简单的jquery插件实例,简单的jquery插件实例,简单的jquery插件实例,内容如对您有帮助，希望把文章链接给更多的朋友！

本教程向您展示如何使 HTML 元素可拖动，在本例中，我们将创建三个 DIV 元素然后启用他们的拖动和放置。

首先，我们创建三个<div> 元素：

对于第一个>div<元素，我们通过默认值让其可以拖动。$('#dd1').draggable();对于第二个 <div> 元素，我们通过创建一个克隆（clone）了原来元素的代理（proxy）让其可以拖动。

对于第三个<div> 元素，我们通过创建自定义代理（proxy）让其可以拖动。

下面为大家分享学校课程表简单实例，欢迎大家学习：

我们将创建两个表格：在左侧显示学校科目，在右侧显示时间表。 您可以拖动学校科目并放置到时间表单元格上。 学校科目是一个 <div class="item"> 元素，时间表单元格是一个 <td class="drop"> 元素。

显示学校科目

显示时间表

拖动在左侧的学校科目

放置学校科目在时间表单元格上

正如您所看到的上面的代码，当用户拖动在左侧的学校科目并放置到时间表单元格中时，onDrop 回调函数将被调用。我们克隆从左侧拖动的源元素并把它附加到时间表单元格上。 当把学校科目从时间表的某个单元格拖动到其他单元格，只需简单地移动它即可。