问题标签 [jquery-ui-sortable]

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

jquery-ui - jqueryUI droppable “drop” 函数仅在我的可拖动“connectToSortable”选项集上触发“over”

您可以在http://designvictim.com/jqueryui/index.html上查看代码

我正在尝试制作类似于从 Wordpress 拖放的小部件。

我已经非常接近我们想要完成的任务,但是我们希望能够在您将项目拖出“放置区域”并将其放到外面时,它会自行擦除并发送带有更新的 Ajax 调用内容。这就是为什么我让#body 可放置。此外,如果您开始从模块列拖动到其中一个放置区域,我希望它在放置之前可以直接排序,并且我能够使用“connectToSortable:'.moduleContainer'”来完成此操作,但现在每次我从一个模块容器中的项目并开始拖动并悬停其中一个放置区域并继续到另一个放置区域, $('#body').droppable() 的放置功能触发了我的想法!

我希望它是我的一些笨拙的编码,而不是 jqueryUI 的错误。提前感谢您的帮助,我希望我能清楚地解决这个问题。

0 投票
1 回答
5181 浏览

jquery-ui - 使用 jQuery UI 同时对多个项目进行排序

我正在尝试使用jQuery UI 的 Sortable plugin设置一种同时对多个项目进行排序的方法。我提出了一个部分解决方案,其中选中的项目随拖动一起移动,但我无法让它们全部移动位置。这是我所拥有的:http: //jsbin.com/ecela

我需要添加什么以确保项目移动到新位置并在拖动开始时被移除。

另外,我想知道是否有办法同时使用 selectable 和 sortable 。我猜不是因为它们都要求您单击项目以选择并拖动/排序它们。

0 投票
2 回答
1906 浏览

jquery - IE8 中的 Jquery UI:在调整可排序和可调整大小的元素大小时暂停排序行为

我有一个元素列表,我想使用 Jquery UI 对其进行排序和调整大小。将它们结合起来在 Chrome 和 Firefox 中效果很好。但是在 IE8 中(无论是在正常视图还是在兼容性视图中),任何一种行为在单独使用时效果都很好,但在组合使用时,所产生的混合行为是不可取的。

我的期望是通过拖动可调整大小的手柄来调整元素的大小不会激活可排序行为并移动该元素。不幸的是,当我拖动元素的调整大小区域时,它也会拖动元素,就好像我在移动它的排序位置一样。我希望这两种行为是排他的。这是复制行为的代码:

我尝试了几种策略来解决这个问题,包括:

  1. 上面的方法,它试图在调整大小开始时禁用可排序。不幸的是,这根本没有效果。
  2. 让可调整大小的启动函数向项目添加一个类,然后按该类进行排序过滤器(例如 $("#wrapper").sortable({items:".item:not(.resizing)"}); 和 $ ("#wrapper").sortable({items:".item", cancel:".resizing"}); )
  3. 关于哪些选择器用于可排序和可调整大小的几种变体
  4. 广泛的谷歌搜索,在我的办公桌上敲打我的头,并在微软的总体方向上喃喃自语。

任何帮助是极大的赞赏。

0 投票
1 回答
700 浏览

jquery - 可排序项目从一个列表移动到另一个列表,失去句柄和排序功能

我有 DIV,其中包含 OL>LI 列表,每个列表都是可排序的,我将它们连接在一起,以便用户可以将 LI 从一个列表移动到另一个列表。似乎是一件很常见的事情。

当可排序列表收到一个项目时,该项目将失去其“可排序性”..或者至少句柄无法处理它。

下面是一些代码,向您展示我如何设置可排序列表:

0 投票
7 回答
55826 浏览

jquery - 如何使用可排序的 jQueryUI 关闭排序?

我已经实现了 jQueryUI 可排序列表,它工作得非常好。在某个时间点,我希望禁用进一步排序并保持项目顺序不变,而用户无法更改它。

它尝试了这样的事情:

和这个:

和:

和:

以及所有这些的各种组合。都没有成功。

谁能告诉 ne The Right Way ™ 去做吗?

更新:我正在使用 jQuery 1.3.2 和 jQueryUI 1.7.2。一个可能的问题是我在页面上有两个独立的可排序列表,所以我有 sortable1 和 sortable2 类。我实际上在做:

Update2:问题是我使用.sortable 而不是#sortable。现在一切正常。

0 投票
2 回答
4379 浏览

javascript - 来自开始事件的 jQuery sortable('disable') 不能完全按预期工作

下面的代码没有完全禁用 start 事件的 sortables。它会将类ui-sortable-disabled和可排序元素添加ui-state-disabled到可排序元素中,但不会禁用该功能 - 换句话说,可排序元素看起来已禁用,但它们仍然接受拖动的项目并表现得像已启用。

我想这样做的原因是在拖动开始时是因为我可能需要禁用已经包含被拖动项目的其他连接的可排序对象(为了简化,我去掉了逻辑)。这是一个错误还是有解决方法?

0 投票
1 回答
1796 浏览

jquery - 在 jquery ui 中按句柄拖动可排序的故障

我遇到的问题是,每当我尝试使用手柄拖放时,在拖放过程中,正文文本不会与文本保持对齐,这在最后附上的代码中进行了说明。

正如网络上的一些示例所示,我不想将句柄放在<p>标签中的原因是我希望允许用户就地编辑 p 标签之间的内容,因此我不想在显示表单之前进行大量预处理(我可能会在 p 标签周围添加更多内容)。

如果有人能对此事有所了解,将不胜感激!

代码,使用谷歌 CDN,所以它应该可以工作:

0 投票
1 回答
4182 浏览

jquery - jQuery可拖动+可排序:奇怪的鼠标偏移行为

我有 < li > 元素的可拖动列表,我可以将其拖动到另一个空的 < ul > 元素中。如果我拖动可拖动原始 <ul> 的第一个 <li> 元素,一切正常......

问题:

...但是当我拖动该列表的任何其他 < li > 元素时,只要我越过接收可排序 < ul > 的边界,“助手”就会远离鼠标指针。更准确地说,它会上升到列表的顶部。

有没有人看到这个并知道解决方案?好吧,我的问题是,我只是在使用 jquery,并没有真正深入了解它,也从未真正深入使用过 javascript。

有关该问题的更多信息:

我的 jQuery 代码:

#roleList 和#roleDrop 是前面提到的无序列表,而#container 是一个表。

现在是发生了什么的屏幕截图。

我开始拖动项目:

http://drop.io/download/public/dkabw5hlq3yfm0f84yji/7bf91122adc241373a5da13b5bde4b231644c1c5/da142000-ff76-012b-41ee-f10bc9db08a6/5a1bfa70-68f6-012c-6d08-f20b5bde4b231644c1c5/da142000-ff76-012b-41ee-f10bc9db08a6/5a1bfa70-68f6-012c-6d08-f20b5bfa70-68f6-012c-6d08-f2025b5a

当我越过第二个 < ul > 的边界时,助手会跳起来。

http://drop.io/download/public/dkabw5hlq3yfm0f84yji/2fad1d633d38cf593da46c638d1930431ea5fd35/da142000-ff76-012b-41ee-f10bc9db08a6/5c65c4c0-68f6-012c-6601-f238d1930431ea5fd35/da142000-ff76-012b-41ee-f10bc9db08a6/5c65c4c0-68f6-012c-6601-f22umbdlarge_d947

如果您也需要 xhtml 标记,请告诉我。

0 投票
2 回答
220 浏览

javascript - 需要不克隆元素的 javascript 排序器(首选 jquery)

到目前为止,我已经尝试过Tiny Table SorterTables on CowsSorttableYoast 的 Sortable-table 插件我在此处的测试页面上当前安装了最后一个。我终于没有与我在同一页面上运行的 qtip 脚本发生冲突。我知道冲突来自使用克隆元素的分拣机。不幸的是,实际的排序功能在最后一个中是错误的。鉴于我的技术限制,我更容易在别处寻找分拣机,而不是尝试学习/弄清楚为什么这个分拣机不起作用。

0 投票
2 回答
2623 浏览

jquery - IE7 jQuery 可排序错误?

我正在尝试使用 jQuery 创建一个 3 列页面,用户可以在其中移动三列之间的框(类似于 iGoogle)。在 Firefox 和 Safari 中,拖动效果非常好。在 IE7 中,一旦您拖动一个框,它就可以正常工作,但之后该框就无法移动。我已经尝试再次将 jQuery Sortable 插件重新应用到任何移动的盒子,但它似乎没有工作。有什么想法吗?

这是代码: http: //www.marksblogg.com/dragging/