如何获得由sortablejs组成的可排序列表的顺序？
sortablejs是一个JavaScript库，用于创建可排序的列表。要获得由sortablejs组成的可排序列表的顺序，可以使用以下步骤：
- 引入sortablejs库：在HTML文件中引入sortablejs库的CDN链接或下载并引入本地文件。
- 创建可排序列表：在HTML文件中创建一个列表，每个列表项都可以被拖动和排序。
- 初始化sortablejs：使用JavaScript代码初始化sortablejs，将列表项设置为可拖动和排序。
- 监听排序事件：使用sortablejs提供的事件监听器，监听列表项的排序事件。
- 获取排序顺序：在排序事件发生时，通过sortablejs提供的方法获取列表项的排序顺序。
下面是一个示例代码：
<!DOCTYPE html>
<html>
<head>
<title>Sortable List</title>
<script src="https://cdn.jsdelivr.net/npm/sortablejs@1.13.0/Sortable.min.js"></script>
</head>
<body>
<ul id="sortable-list">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
</ul>
<script>
// 初始化sortablejs
const sortableList = document.getElementById('sortable-list');
const sortable = new Sortable(sortableList, {
animation: 150
});
// 监听排序事件
sortableList.addEventListener('sort', function(e) {
// 获取排序顺序
const sortedItems = sortable.toArray();
console.log(sortedItems);
});
</script>
</body>
</html>在上面的示例中，我们创建了一个包含四个列表项的可排序列表。通过初始化sortablejs，并在排序事件发生时获取排序顺序，可以在控制台中打印出排序后的列表项顺序。
这是一个基本的示例，你可以根据实际需求进行定制和扩展。腾讯云没有直接相关的产品和产品介绍链接地址，但你可以根据实际需求选择适合的云计算服务来支持你的应用。
相关·内容
我的代码看起来像这样： new Sortable(sortablelist, { ghostClassDOCTYPE html> <head> <script src="https://raw.githack.com/SortableJS
浏览 64提问于2020-08-11得票数 0
回答已采纳
我使用Json对象数组列表来显示数据。现在我想使用一个可扩展的列表视图，其中的数据根据对象中的日期进行分类。如何根据日期对子列表进行分类。
json对象由接送日期和乘客详细信息组成。我想排序并创建一个可展开的列表视图，该视图由主列表中的日期和子列表中的乘客详
浏览 1提问于2014-08-11得票数 1
3回答
我有两个数组列表，它们由datetime对象组成，并使用合并这两个列表。现在，我想按照数组组成的date time对象的顺序对该数组进行排序。谁能指导我如何对这个数组列表进行排序。
浏览 1提问于2012-02-02得票数 0
回答已采纳
我有一个ArrayList的东西。我现在不能正确判断，但我非常确定，Object有compareTo(Object)，它在任何情况下都会返回int。private static void sort(ArrayList<String/Integers, or SomethingElse, not sure now> list)
我试着搜索类似于多原始类型的东西
浏览 9提问于2017-01-23得票数 2
回答已采纳
4回答
jQuery列表不会在追加后排序
、、、、
1 : -1; });
我有一个最初由4个项目组成的列表，#冷却器是一个元素，当我单击它时，将按字母顺序对这些项目进行排序，然而，keyup函数会将新项目附加到列表中，而#coolthings按钮不会将整个列表与新添加的项一起排序，它将按字母顺序排序初始列表，然后按字母顺序添加新项目，从而使整个列表<
浏览 5提问于2014-05-27得票数 1
回答已采纳
3回答
我正在为托儿所的孩子做一个在线考试，在这个考试中，我有一些由从0到6的零散数字组成的列表<li>元素，例如： <li> <div>3</div></li> <li> <div
浏览 0提问于2020-05-17得票数 0
2回答
我有一个Spring应用程序，它的端点返回JSON中的条目映射。Map<String, List<StatementItem>{ "8 Jun 2021": [...],
"7
浏览 1提问于2021-06-11得票数 0
回答已采纳
教程提到了“自然排序”的概念：
如果列表由字符串元素组成，则按字母顺序排序。如果它由日期元素组成，它将按时间顺序排序。这是怎么发生的？字符串和日期都实现了可比较的接口。类似的实现为类提供了一个自然排序，它允许自动排序该类的对象。下表总结了实现可比较的一些更重要的Java平台
浏览 10提问于2016-10-19得票数 5
2回答
我需要按排序顺序打印最后的数组元素。#define MAX 9int array[MAX]; //Array forread_counter <
浏览 1提问于2016-01-28得票数 0
回答已采纳
我有一个由字符串数组组成的ArrayList，我试图让我的程序的用户进行自定义排序。字符串数组每个由4个字符串组成。我希望允许用户根据这些字符串中的哪个字符串进行选择，以及按照哪个顺序对数组列表进行排序。示例{"A", "B", "C", &
浏览 3提问于2015-08-06得票数 0
回答已采纳
我有一个表中的数据，其中的字段由个人的姓名组成，行由与他们对特定任务的贡献相关的数据组成。例如：人员1的总和是13，而人员2的总和是25。我希望结果显示Person 2，Person 1顺序中的列。
我希望对查询结果进行排序，以按每个人的总和(列总和)的顺序重新排列表</e
浏览 2提问于2016-04-23得票数 0
我做了一些研究，但找不到按特定顺序(即按特定列表)后的列对表(列表列表)进行排序的方法。
我有一个由列表列表组成的表，其中每个子列表表示表的一行，它的每个元素都是该行的列值。My_table有4列，我需要根据几个选项对表进行排序。我目前先按第一列排序，然后按第二列排序
浏览 3提问于2013-05-30得票数 2
回答已采纳
3回答
快速问一下，假设我有一个由主机名或IP组成的节点列表/集合，现在我想按字母顺序再按数字顺序对它们进行排序，所以使用.sort()调用是正确的方法吗？
浏览 0提问于2011-06-01得票数 2
1回答
我有一个由6个不同字母组成的变量，我需要对它进行排序，获得6个不同的索引，这样我就能够根据这个定性变量对数据集进行排序。", "R", "I", "A", "B", "E", "A", "E",
"I", "H", "A", "E",
浏览 1提问于2020-03-16得票数 2
回答已采纳
我有一个2D列表(示例如下)，每个元素由一个整数和一个字符串组成。我想对这个列表进行排序，这样数字就是降序的，但是当有连续的相同数字时，我需要按字母顺序排序。
浏览 1提问于2019-12-28得票数 1
我有两个由.csv文件创建的列表。第一个由一个分支id号和一个对应流的列表组成。第二个是我希望对分支ids及其对应流进行排序的顺序。'1546-2645-1']
我想知道如何按照branch_flows排序的方式对ordered_branches进行排序，但是排序后流要与相同的ids保持关联
浏览 1提问于2012-08-02得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
