问题标签 [jquery-ui-draggable]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
4506 浏览

javascript - 如何获取在拖动事件 jqueryui/jquery 中单击了哪个 div/ui.helper?

在 Jquery UI 的网站上:

http://jqueryui.com/demos/draggable/

如果我有:

和:

如何使用回调中的“ui”变量获取 ID 的 ID 或类?如果不可能,我如何从“事件”变量中获取它?

0 投票
1 回答
2614 浏览

jquery - jquery UI可拖动:在容器内水平拖动溢出:滚动?

嘿伙计们,我已经使用 jqueryUI 可拖动功能来实现拖放行为。

这次我想知道是否可以轻松地将拖动行为实现到水平滚动条?

例如,我有一个 div 容器,其中包含图像和段落。容器有overflow-x 滚动,所以会出现一个滚动条,让我水平滚动容器的所有内容。

是否可以实现拖动行为,因此当我单击图像时,我可以在容器边界内水平拖动容器的整个内部内容。

听起来很复杂,我知道 :) 但我的计划实际上很简单。看看这个例子:http: //jsfiddle.net/TT9hq/2/

我只想能够像使用滚动条本身一样拖动每个水平滚动条容器内的内容。

0 投票
2 回答
5187 浏览

jquery - 将 Draggable 连接到 Sortable 会导致辅助元素跳转

我在页面上有一个 jQueryUI 可拖动对象和一个可排序对象。

将一个元素从 draggable 拖动到 sortable 会导致被拖动的元素跳到页面的左上角

这是演示:http: //jsfiddle.net/travisrussi/aBhDu/1/

重现:

  • 将“项目 5”从可拖动的 div(顶部框)拖动到可排序的 div(底部框)

实际结果:


似乎拖动的元素从相对定位切换到绝对定位。拖动的“li”从以下位置切换:

对此:

当可拖动项被拖动到可排序对象中时。


这是来自 jQueryUI 1.8.12 的相关片段(从第 3041 行开始):


是否有一些我没有使用的配置选项?

CSS有问题吗?

或者这是 jqueryUI 中的一个错误?

0 投票
2 回答
1053 浏览

jquery-ui-sortable - 使用 jQueryUI 在表格中拖放一行

我是 Javascript、jQuery 和所有客户端内容的新手。

我正在尝试在同一个表中拖放一个“表行”(每行都有一个标签和 2 个复选框)。我正在使用 jQueryUI 的可拖动和可放置。我遇到的问题是:

  1. 例如。当我单击/拖动第 1 行到第 3 行时,第 1 行(所有元素都合并为一个<td>)被设置在<td>我拖动到的任何给定行的 中。

  2. 拖动的行应该从它被拖动的地方移除。

我在这里包含了链接。

0 投票
1 回答
1884 浏览

javascript - jQuery UI 可排序和可拖动的列表交互不能正常工作

我在这里为魔兽世界玩家提供了一个食谱跟踪工具:http ://www.wowgeeks.com/tracker.php?item=recipes 。我有三个定制设计的列表:一个“拥有”列表、一个“需要”列表以及可供选择的原始项目列表。我将最后一个列表作为可拖动列表,并将其connectToSortable设置为前两个列表共享的类。

三个列表的 HTML:

这是可拖动/可排序的 JavaScript:

由于某种原因,我将一个项目从第 3 个列表拖到第 1 个列表一两次后,它突然拒绝合作。第三个列表中的项目突然变得不可拖动。但是将项目从第三个列表拖到第二个列表就可以了。您可以尝试上面的链接并自己测试一下。谁能告诉我可能是什么问题?

0 投票
1 回答
3040 浏览

jquery - jQuery $(ui.draggable).remove() 不适用于 IE

只要它不是当前的可拖动对象,我就可以让 IE 删除对象。这适用于 Chrome 和 Firefox。有什么我做错了吗?

0 投票
1 回答
1605 浏览

jquery - jQuery可拖动克隆的div

我的网页实现有问题JQuery。我知道很难理解我想要做什么,但我会尽量让它最清楚(尽管我的英语不是很好)。

我有一个网页,其中有一个可以在“包含包装器”中拖动的 div,并且我已经实现了,当你拖动它时,你会得到该div 的克隆(副本),然后你可以拖动这个克隆的 div在屏幕周围(在“containment-wrapper”内)。每次拖动div 时,都会创建另一个克隆的 div。它完美地工作。

编码:

问题是我必须实现,当您加载该网页时,用户已经在服务器中保存了他的前 div 的情况:所有克隆 div 的位置(我保存了div 的 id 和位置 - 顶部走了)。

因此,我正在尝试实现一个代码,该代码仅在页面加载时执行,该代码创建并将用户保存的克隆 div放置到屏幕上(在“containment-wrapper”内)。

我用这段代码得到了它(我有以下值:$id -div 的 id,$left$top - 我必须创建的 div 的位置):

它在我想要的地方创建了克隆的 div,但我的大问题是,当我尝试用鼠标拖动克隆的 div 时,在被拖动的 div 内部,它开始被拖动div(我从中创建克隆的 div) 并创建另一个克隆的 div。因此,无法拖动我的代码创建的克隆 div。

我希望有可能了解我的所有情况和问题......知道如何解决它吗?

我也尝试做这样的事情(我想用它来处理可拖动事件函数中的位置):

但是当我用firebug(firefox插件)调试它时,我看到事件draggable永远不会执行。

非常感谢您的宝贵时间,

阿莱克斯

0 投票
1 回答
1379 浏览

jquery - 使用ajax拖放后拖动的项目消失

我真的对 jQuery 拖放有问题。所以让我稍微解释一下情况。

我想要实现的是:当您在时间线上拖动其中一个泪珠时,div 中的 id 和它所放置的项目的 id 应该在放置后立即存储在我的数据库中。

我设法用ajax做到了,这是代码:

但是当我这样做时,拖动的项目(或该项目的克隆)就会消失。我不知道为什么,因为页面没有刷新。新项目只是不会存储。

我尝试的另一个选项是将拖动的项目的 ID 和放置的项目 ID 放在文本框中,并在每次放置某些东西时保存它。但这也行不通。

我真的希望有人能帮助我!提前致谢。

在此处输入图像描述

0 投票
1 回答
20625 浏览

jquery - 如果在此 div 之外和其他可拖动对象内部,则可拖动恢复(使用无效和有效恢复选项)

在 ui draggables ( http://jqueryui.com/demos/droppable/#revert ) 上,如果一个 div 在一个 div 内,如果它不在另一个 div 内,是否可以恢复它?例如像这样

但是由于明显的原因,这不起作用..我可以设置条件吗?..因为它在这个droppable里面而不是那个droppable里面?

0 投票
1 回答
916 浏览

ckeditor - jQuery-ui 可拖动元素进入 CKEditor?

我正在测试一个不同的功能,不知何故,我不小心将我用 jQuery UI 渲染为“可拖动”的图像放到了 CKEditor(jQuery 版本)窗口中。编辑器中的源代码已相应更新。机缘巧合!

但这就像我刚刚看到了一只独角兽——它只发生过一次,我无法复制效果。

有没有其他人能够让这两个工具一起工作?如果是这样,诀窍是什么?