问题标签 [jquery-ui-droppable]

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 回答
1703 浏览

jquery - JQuery Draggable + Droppable + Sortable

我敢肯定这已经被回答过,但我找不到适合我情况的例子。我有一个可拖动的图像列表。我还有一个设置为可放置和可排序的 div (id="dropZone")。当图像被拖放到 div 上时,我想触发一个函数,而不是在将事物从排序中拖放到 div 上时触发一个函数。这是我尝试过的:

这是我添加到可放置图像中的,但是即使它们被放置在可放置图像之外,它也会触发。

然后我尝试将它添加到我的 droppable 中,但这会在图像被拖放和排序时添加图像。

有人知道我需要做什么吗?

0 投票
4 回答
14325 浏览

jquery - jquery 可拖动 + 可在放置事件时使用自定义 html 排序?

在可放置区域放置元素时更改 html。

像这样的东西:http: //the-stickman.com/files/jquery/draggable-sortable.html

但是当我删除元素更改放置的html。

其他示例:我有 2 个列表,第一个可拖动列表和第二个可放置列表,当我从第一个列表中拖动元素并将此元素放入第二个列表时,该元素将被克隆到第二个列表

拖动:

降低:

我想将此 html 更改为

拖动:

降低:

0 投票
1 回答
492 浏览

jquery - 使用 jQuery UI 交换项目时防止克隆向后浮动

我正在使用 jQuery 可拖放/可拖放来启用网格中的元素进行交换。例如,当元素 1 被放到元素 2 上时,它们会改变位置。

有两个问题:

  1. 成功拖放后,克隆仍会漂浮回其原始位置。我怎样才能防止这种情况?如果它没有落到有效目标上,我只希望它飘回来。

  2. 理想情况下我也想设置helper: original,但是当我尝试这个时,我无法弄清楚如何正确计算drop函数中的交换位置。

我已将代码放在jsFiddle上,供参考:

0 投票
1 回答
185 浏览

jquery-ui-droppable - jQuery可丢弃问题

我编写了 jQuery 代码,允许用户在屏幕上创建 2 个框,然后将一个拖放到另一个中。从 HTML 的角度来看,它看起来像这样......

如果我然后创建另一个框并将其拖到框 2 上并放下它,它总是被放入框 1(即框 2 的父项)中。我想要的是这个...

......但我得到的是这个......

您 [曾经能够]可以在这里看到这种情况... http://acarna.com/editor.php <- 我已经解决了这个问题...请参阅下面的答案

单击左上角的“H”按钮以创建一个框。抓住框右上角的灰色方块,将其进一步向下拖动到页面中。将鼠标移到框的边缘或角上并调整其大小。

然后再次单击“H”以创建框 2。将框 2 拖放到框 1 中。这可以正常工作。如果您使用 Firefox,您可以看到框,因为它在鼠标悬停时添加到框 1。

我遇到的问题是在创建框 3 时,将其移到框 2 上并尝试将其放入其中。它只检测框 1 并将其放入其中。

当框 3 被拖到框 2 上时,我是否缺少一些技巧让 jQuery 检测框 2,并将其添加到那里?

0 投票
1 回答
4459 浏览

jquery-ui - 在 droppable 的 Drop 事件上调用 $(item).sortable('cancel') 会禁用可排序

我有一些可排序的连接列表,它们同时是可放置的地方。问题是当我在 droppable 的 drop 事件中调用 sortable 的 cancel 方法时,sortable 坏了,不能再工作了。示例http://jsfiddle.net/zSnBA/10/尝试将 div 编号 102 移动到第二个列表中:您会看到取消事件将被调用,但 sortable 将不再起作用?有什么帮助吗?

0 投票
1 回答
2961 浏览

jquery - 如何使可拖动捕捉到可放置,允许交换?

我不知道如何问这个问题,但我希望创建一个界面,其中左侧存在三个元素(A、B、C)并且可以拖动到右侧的三个元素(1、2、3)。

我希望左边的物品在掉落时能吸附到右边的物品上,然后可以与其他两个物品互换。

我可以让 A、B 和 C 对齐到右侧,但似乎无法让它们能够交换。如果我将 设置ui.draggable.position在 drop 上,那么我无法弄清楚如何在右侧重新排列它们。我试过克隆和删除它们无济于事,我最终得到了一些错误。

到目前为止我有这个:http: //jsfiddle.net/7xFsr/13/

提前致谢!

0 投票
1 回答
3957 浏览

jquery - 检查 droppable 是否已经包含另一个可拖动元素(jQuery UI)

我有一个可拖放的 div 元素,当一个可拖动的元素被拖出它时,它会淡出。使用 out 事件可以正常工作。我遇到的问题是当 droppable 上有两个可拖动元素时。当我拖掉一个可放置元素时,它仍然会消失。如何检查 droppable 上是否已经有另一个可拖动元素,以便取消淡入淡出效果。我希望仅当最后一个可拖动元素被取下时,可放置元素才会消失。

0 投票
1 回答
259 浏览

jquery - 禁用警报消息并简单地放入 jQuery UI

我做了一个jQuery拖放功能。但是里面有一个小错误。我找到了一个函数,它有一条警告消息,但我不想要那个。我只想删除元素。这是我的代码:

0 投票
2 回答
593 浏览

jquery - 如何使用 jQuery 删除克隆的图像?

我无法删除克隆的图像。但这在我评论该helper:"clone"选项时有效。

0 投票
2 回答
2483 浏览

jquery - jQuery,保存多个可拖动对象的原始位置以将它们恢复

请参阅 jsfiddle

一旦我将“可拖动”对象放在目标上,下次返回时将使用该特定位置。有什么方法可以保存可拖动对象的原始位置并始终将它们恢复到它们(第一个位置)?或者除了“拯救他们”之外还有其他解决方案来实现相同的目标吗?

我发现了一些类似的问题,但是位置(左,上)在其中被硬编码以恢复。我很努力,但找不到解决办法。

谢谢你。