可排序-更新现有数组- jQuery
可排序（Sortable）是指可以通过拖拽或其他方式改变元素的位置或顺序的功能。在前端开发中，jQuery提供了一个名为Sortable的插件，它可以用于实现可排序的功能。
Sortable插件是基于jQuery UI的一个插件，它允许用户通过拖拽元素来重新排序列表中的项目。它为开发者提供了灵活的配置选项，可以满足不同场景下的排序需求。
使用Sortable插件，可以对列表、表格、图标等进行排序，并且可以自定义排序规则。开发者可以通过简单的配置来定义拖拽的限制、排序的容器、排序的方向等。Sortable插件还支持事件回调，以便开发者可以在排序发生时执行自定义逻辑。
Sortable插件在实际开发中有广泛的应用场景，例如：
- 页面中的图标排序：可以通过Sortable插件实现拖拽排序功能，让用户自定义页面上的图标顺序。
- 列表中的元素排序：可以使用Sortable插件实现对列表中的项目进行拖拽排序，例如对任务列表、产品列表等进行排序。
- 表格中的行排序：Sortable插件也可以用于表格中行的排序，例如对表格中的数据按照某一列进行排序。
- 页面布局中的排序：对于页面布局中的元素，可以使用Sortable插件实现对它们的拖拽排序，例如对可调整大小的布局块进行排序。
腾讯云提供了云服务器（CVM）和云数据库MySQL等产品，可以为开发者提供稳定可靠的云计算基础设施和数据库服务，以支持前端和后端的开发工作。同时，腾讯云还提供了云原生产品，如云原生容器实例（Cloud Native Container Instances）和云原生数据库TDSQL等，用于支持云原生应用的构建和运行。
详细了解腾讯云的产品和服务，请访问腾讯云官方网站：https://cloud.tencent.com/
相关·内容
1回答
我有一个现有的元素数组，例如： arr=[{name:1,data:xyz},{name:2,data:abc},{name:3, data:lmn}; {name:4,data:opq}] 这些项目将根据其在示例：1 2 3 4 5 我已经实现了jQuery的可排序。我希望在用户完成对上述元素的拖放操作后，根据元素的新位置更新现有的数组arr，而不是创建一个新的数组。用户可以移动数组arr中的元素，并且不能从1 2
浏览 19提问于2021-01-19得票数 1
回答已采纳
我正在使用Jquery UI sortable： handle: ".handle",
update: function，我就会让它调用php脚本，在该脚本中获取信息并更新数据库中的视图顺序。然后，我从数据库中获取所有数据，并将其输出回jquery脚本，以便他们可以看到更新后的视图顺序。但是，当发生这种情况时，可排序脚本将不再起作用。在ajax更新列表
浏览 0提问于2016-05-22得票数 1
@Scripts.Render("~/bundles/jqueryval")<script type="text/javascript" src="@Url.Content("
浏览 0提问于2014-03-17得票数 3
回答已采纳
4回答
我用React可排序的专案来移动物品。我的初始状态是一个空数组，我需要用中的函数更新状态。 colors: arrayMove(colors, oldIndex, newIndex)};
最终所发生的是没有错误，但更多的颜色被添加时，我试图安排任何现有的颜色
浏览 1提问于2019-09-03得票数 7
回答已采纳
1回答
因此，基本上，我如何将jQuery UI可排序元素与数组链接起来，以便在数组中为每个可排序元素放置某种类型的索引，并在移动它们时对数组进行相应的排序？
浏览 0提问于2012-11-16得票数 1
回答已采纳
1回答
我有一个使用observableArray绑定从foreach填充的可排序的夹具列表。数组中每个夹具中的一个参数是position。$( "#picks" ).sortable({
revertnth-child('+i+')').find(
浏览 4提问于2015-09-19得票数 1
1回答
我被要求用PHP编写一个web应用程序来处理客户，销售，估计，发票……我认为我可以从封装一些基本UI功能(可排序列表、屏蔽输入字段、日期选择器……)的JavaScript库中获益。jQuery是我为常规JavaScript任务选择的库，但我发现缺乏重要的小部件/特性，而且很难样式化。
你有什么意见建议？
浏览 2提问于2010-04-13得票数 1
回答已采纳
我使用下面的jquery插件在表单中创建可重复的输入域。我还通过jquery可排序插件添加了对元素重新排序的支持。除了可重复元素的索引混乱之外，一切都很正常。通过阅读中继器插件的文档，我发现有一种方法可以重置索引，但我无法理解如何在拖放之后触发该功能。有没有人能建议我怎么做？这是我的可排序代码 ax
浏览 8提问于2015-10-28得票数 1
我正在尝试用aurelia实现jquery-ui的可排序列表功能。用dom中的新订单更新项目(在aurelia控制器中)的最好方法是什么？"ref“是这里的一种方法吗？很容易对dom中的列表项进行重新排序，但是如何将更改应用到aurelia-list-object？</li>一种方法是将$index附加到li-item，在顺序更改后使用jquery读取它们，并创建一个顺序为(0,3,1,2)的新数组
浏览 0提问于2016-09-13得票数 0
我在一个web应用程序中有一个可排序的列表，当用户结束他的交互时，我想更新模型。问题是，我能否依靠jQuery find给出元素的有序子元素？
如果是，这在jQuery文档中声明在哪里？
浏览 4提问于2014-01-07得票数 0
回答已采纳
有没有办法更新文档数组以将项目从一个索引移动到另一个索引？例如： name: "myDoc",}
因此，对于JQuery-UI可排序事件，it2和it3互换了位置。因此，我想要更新他们在存储在MongoDB中的myDoc中的位置。
浏览 3提问于2013-06-13得票数 9
无论如何，我正在尝试基于Knockout JS和Jquery UI创建一个简单的任务管理器。经过一些研究，我发现了一个小插件，它可以帮助连接KO和JqueryUi的sortable，你可以在这里阅读到它：
该插件可以很好地更新可观察数组的顺序，但我还需要根据元素在数组中的位置刷新元素的一些值。我尝试在每次排序后更新整个数组，我注意到一个奇怪的行为:虽然UI保持不变，但如果我将数组发送到JSON，它会用正确的值更新！你可以在这里找到我的
浏览 6提问于2012-06-05得票数 0
回答已采纳
1回答
我正在使用twitter引导、敲除、剔除排序和JQuery用户界面(也是haml，但这与问题无关)。我显示的选项卡列表如下所示。它添加了一个带有按钮的最后一个选项卡。%span{ "data-bind" => "text: name()" } %li %i.icon-plus
我正在尝试使选项卡可排序如何使用可排序实现相同的效果(最后一个选项卡是一个按钮)？但
浏览 2提问于2013-03-31得票数 2
回答已采纳
1回答
我正在使用jQuery UI可排序，以允许用户排序的图像，他们已经上传了拖放。下面是它的工作原理：我的问题是，如何更新我的数据库以重新排列图像并保存与序列化返回的顺序相同的顺序？
谢谢
浏览 2提问于2016-04-18得票数 2
回答已采纳
交互连接到了可排序列表中。我知道如何使用jQuery将它们显示为2个可排序的列表，我还可以将“答案”从“坏问题”删除到“好问题”。但是，我如何将他们的新排序位置和他们新排序的关联保存到另一个“问题”回Rails数据库？Railscast有如何保存单个可排序列表的位置，但不保存属于不同关联模型的列表的位置。
我真的很感激你们的帮助！这是Railscast如何将POST传递给Rails控制器以排序顺序传递object_i
浏览 1提问于2012-11-02得票数 2
回答已采纳
1回答
使用jQueryUI教程中提供的示例：
当我将可拖动的<li>元素拖放到可排序列表中时，它将被克隆。一切都如期而至。然后，克隆元素也可以重新排序。这也如预期的那样起作用。这向我显示，在创建克隆并将其添加到可排序列表后，不会为特定的克隆触发单击事件。实际上，单击事件似乎已经从克隆中删除，或者现有的$("li").on("click", ...函数无法识别它，因为它是稍后添加到DOM中的。如何通过可排序列
浏览 6提问于2013-01-16得票数 3
回答已采纳
我想添加自定义排序和过滤功能到我的应用程序，并希望它们是可重用的(跨多个组件)。上述函数将用于允许用户在我的模板中订购列表/表内容和筛选数组。此外，可以在用户操作之后动态修改某些内容(例如:如果通过我们的数据库，远程用户向表中列出的集合添加了一个新元素，则本地用户的更新数据应该尊重以前应用的排序/筛选)。对于纯管道，角忽略组合对象中的更改，例如现有数组的新添加元素，因为检查原始值或对象引用要比对对象内部的差异进行深度检查要快得多。角可以快速确定它是否
浏览 3提问于2021-02-09得票数 0
+ association, "g");} $(".sortable_list").sortable({ }).disableSelection();这里现在的问题是，对于现有内容，在页面加载时附加的ul中有一个类ui-sortable，因此j
浏览 0提问于2012-01-08得票数 2
回答已采纳
我正在和VueJS一起使用jQuery可排序插件。插件更改了DOM，但这些更改不会反映在我的components数据对象上。有什么帮助吗？
浏览 2提问于2017-10-05得票数 1
使用，我试图在一个由Ember.ArrayController加载的模板中实现一个可排序的列表，该模板包含一个Phonenumbers数组作为内容：<b>{{phonenumber.cost}}</b>我试着在排序</e
浏览 3提问于2013-04-16得票数 2
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
