问题标签 [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 回答
470 浏览

jquery - 删除后的JQuery可拖动更新数组

我不确定最好的方法,我确信我的 JQuery 至少可以说是“笨拙的”,但它完成了工作的第一部分。

我正在将“产品”拖到这样的篮子中:

是的,我在删除后也在“操纵 CSS”。到目前为止,我可以“获取”删除元素 ID 的唯一方法是将篮子设置为这样的可排序

通过这样做,我可以使用“结果”警报来查看排列的 ID - 这有效,但我确信它是不正确的。当我像这样从篮子中取出掉落的物品时,不起作用的是:

我真正想要发生的是要更新的购物篮数组。但事实并非如此。请提供任何线索。谢谢。- 哦,请尽量保持“简单”,因为我在 JQuery 中“非常简单”

0 投票
2 回答
5765 浏览

jquery - 当鼠标悬停在可拖动时,jQuery droppable 'over' 事件不会触发

我有一个可拖放的任务列表。它们都有一个“over”事件处理程序,以确保当另一个任务悬停在它们上方时它们会亮起。

这并没有像我想要的那样完全有效。当我开始拖动一个任务时,其他任务没有按预期亮起,除非鼠标实际上不在可拖动助手上方(这是可能的,因为我指定了axis ='y',以便我可以移动光标在不中断拖动会话的情况下,帮助器的左侧和右侧)。

我认为问题可能是我正在拖动的任务也是可放置的,所以我指定一旦它被拖动,它的可放置性必须被禁用。

那么为什么在可放置目标上放置可拖动助手不会触发 over 事件,而将光标放在可放置目标上会触发该事件呢?

这是代码:

0 投票
3 回答
14147 浏览

javascript - 如何在不实际拖放的情况下使用 jQuery UI Droppable 触发 Drop 事件?

我有一个带有 drop 事件处理程序的droppable :

我有一个可拖动的:

我想要做的是触发droppable上的 drop 事件处理程序,而无需实际拖放draggable。我想模拟实际行为而不实际执行行为。

我认为这样的事情会做:

不幸的是,事情并不是那么简单。有谁知道我怎么能做到这一点?

0 投票
1 回答
2070 浏览

jquery - jquery droppable 接受超过 1 个元素/选择器

从这里继续:jquery droppable 接受

如果我不是针对一个元素而是一组元素怎么办?比如“ul#moo li”。我将如何更改 IF 条件???

0 投票
1 回答
811 浏览

jquery - jquery 可放置目标

如果我有一个包含很多单元格的表格,让我们假设 50 行 x 50 列,那么将 jquery “droppable”应用于每个单元格是否效率低下?

例如,我可以将 droppable 分配给父表,然后以某种方式捕获项目被丢弃的实际元素(即 TD)吗?如果我没记错我的事件委托,在任何给定的事件中,TD 首先收到它,然后是 TABLE。

有人可以启发我吗?

杰森

0 投票
1 回答
158 浏览

jquery - jquery ui - 引用丢弃的元素

所以我知道如果一个元素是可放置的,那么你可以设置一个选项,如:

但是我该如何设置它,以便我可以引用放置在它上面的元素,所以我可以做这样的事情:

谢谢。

0 投票
2 回答
394 浏览

jquery - jQuery how to find the class of the Droppable Div?

I have two divs: one draggable and one droppable

When I release the draggable div I want to find the class of it's parent to take an action if it is dropped on a droppable div, otherwise cancel the dragging.

I want to put a condition in the stop function of the draggable that if it's dropped on a div with class "drop" then it's ok, otherwise cancel the drag operation

What can be the function that performs this ?

thanks.

0 投票
1 回答
325 浏览

jquery - 通过单击按钮验证其放置后,如何将 jQuery Draggables 返回到其原始列表?

这有点奇怪,但我正在使用 jQuery UI 制作匹配游戏,我希望允许用户从<ul>jQuery draggables(列表 A)之一中拖动元素,然后将其放入 jQuery droppable(列表 B)中。在用户确定他们认为列表 A 中的每个项目都在列表 B 中的正确位置后,他们可以单击一个按钮来检查他们的答案。

这就是棘手的地方。单击检查答案后,正确的项目会变为绿色并锁定在适当的位置,而错误的项目会留在不正确的 droppables 中。有没有人对我如何将不正确的项目返回列表 A 有任何好主意?

我可以发布代码,但我不确定是否有必要,我只需要想法和/或模拟实现。

谢谢!

**

编辑:

所以感谢Ken,这就是我正在做的事情......当项目被删除时,jQuery会为其添加某些css属性;position:relativetopleft被更改,以便该项目将保持固定在其接受的放置位置。为了恢复这些,我只是做了以下事情(在添加correctLoc到正确丢弃的项目之后):

$('li:not(.correctLoc)').animate({top: 0, left: 0});

谢谢肯!

**

0 投票
1 回答
865 浏览

jquery - 将可排序对象悬停在可放置对象上时添加突出显示动画JQUERY

我有一个称为项目的可排序对象列表,以及一个称为可放置类别的对象列表。我需要以某种方式做到这一点,以便当您单击可排序项目并将其向下拖动以使其悬停在可放置类别上时,该项目将进入的类别突出显示,或概述或其他类型的动画.

我确信它可以通过像 add-class-on-hover-over-droppable-object 类型函数这样简单的方法来完成,但我不知道它应该如何设置。

查看一些 jQuery 文档,我发现对于一个可放置的对象,您可以设置一个over: function(),属性,但我无法让它工作......

我需要做什么才能完成这项工作?

0 投票
2 回答
4011 浏览

jquery - 当达到可放置限制时,jQuery UI 可拖动/可排序/可放置禁用放置

JS Bin 演示

任务:

我正在使用 jQuery UI 创建一个事件调度程序。事件有一定的长度(以分钟为单位),它们可以拖到不同的日子,每个日子都有自己的最大长度(以分钟为单位)。在示例中,每天的最大长度为 480 分钟,并且不应允许插入不超过 480 分钟的“事件”。

问题:

如果“事件”将导致“天”超过其最大时间长度(基于已放置在其上的元素的组合时间),则应禁用该“天”(此特定事件不允许放置)。

正如您从演示中看到的那样,我可以计算出每天事件的总时间(“可用分钟数”在拖动停止时更新),但我不知道如果事件被拖动,如何禁用进入当天会导致“可用分钟数”变为负数。