jquery - 使用 jquery 可拖动/可放置和可排序创建新元素

原文 标签 jquery jquery-ui jquery-ui-sortable

我想做的是创建一个卡片分类脚本。基本上,您有一个“卡片”列表,然后您应该将其分类为任意数量的“堆栈”(列表)。我正在使用 jQuery-UI 可排序插件,并且能够连接列表以在它们之间拖动。我面临的问题是我无法找到一种方法来检查卡片是否悬停在空白区域或现有列表上,如果是前者,当我放下它时,创建一个新列表。

我曾尝试使用可拖动/可放置,以便卡片最初不限于可排序,但我仍然无法让它识别卡片的位置。我还认为可拖动/可放置将不是我所需要的,因为这样我就无法将卡片从可排序的列表移回原始列表(可拖动)。

最终,我将使用 jQuery 的 ajax 功能来保存排序的结果,但我不能这样做,直到我可以让它创建新列表。

有没有人有做这样的事情的经验?任何帮助都会很棒!

最佳答案

抱歉回复晚了,但正在努力,没有注意到其他答案。

我的变体与 Goran 的变体相当。 http://jsfiddle.net/fordlover49/rxVPq/

请注意,您需要根据您仍然想要的内容添加标题和其他所有内容,但它实现了基本目标,同时保留原始项目,并且只有一组可排序列表选项..

虽然 Goran 的解决方案似乎有效,但我要提醒您,他用来移动物体的方法是危险且不正确的。如果您在移动到新列表的项目上有任何事件绑定(bind)器,它们将丢失,因为他已从 DOM 中删除了您具有事件绑定(bind)的旧项目。

关于jquery - 使用 jquery 可拖动/可放置和可排序创建新元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9012029/

相关文章:

jquery-ui - jQuery UI 可拖动元素始终位于顶部

javascript - 在图像上实现平移窗口?

javascript - Chrome 扩展程序 : Insert text into textfield when clicking button in pop-up

javascript - typescript 错误:类型“元素”上不存在属性“包含”。

Jquery从django对象构造数组

javascript - 需要有关定位初始隐藏对象的建议

javascript - 使用sortable.js时禁用 Bootstrap wysihtml5

jquery - 将对象拖入可排序列表 - AngularJS

javascript - 如何在jQuery UI中将多个可排序列表彼此连接?

javascript - 将click事件动态更改为dojo按钮