JavaScript保持数组有序

我试图以特定的顺序保存数组，并且我已经了解了要插入特定索引位置的拼接函数，但它似乎做得不对

以下是我到目前为止所掌握的一些资料：

在第1节中，您可以选择一个或多个选项，但是“First”应该始终是第一个，“second”应该是第二个，并且在这两个选项之后是第四个。如果您只选择“第一”和“第四”，则无论您选择框的顺序如何，它们都应按该顺序排列

在第2节-您只能选择选项A、B和C中的一个。。。该选项应始终位于数组的第3个位置（当然，除非您没有从第1节中选择任何项目，否则它将在数组中单独出现）

老实说，我不知道接下来该怎么办。我试过这个：

var array_position = $(this).attr('id');
var messagePart = $(this).attr('data-message');

message.splice(array_position, 0, messagePart);

但是它们仍然没有按正确的顺序结束。

使用

splice（）

插入项的索引应该

0

-索引。例如：

var arr = [1,2,3,5,6];
arr.splice(3, 0, 4);

将

4

插入第三个

0

索引位置

此外，在插入所需的值时，需要使用

0

作为

splice

中的第二个参数

要使代码正常工作，您应该将每个输入的

id

参数更改为

0

-索引，然后使用

splice（）

插入项目

$(".mycheckbox").on("change", function() {
  var message = [];
  $('.mycheckbox:checked').each(function() {
    var messagePart = $(this).attr('data-message');
    message.splice($(this).attr('id'), 0,messagePart);
  });
  $(".summary").html(message.join(", "));
});

下面是一个工作示例：

$（.mycheckbox”）.on（“更改”，函数（）{
var消息=[]；
$（'.mycheckbox:checked'）。每个（函数（）{
var messagePart=$（this.attr（'data-message'）；
message.splice（$（this.attr（'id'），0，messagePart）；
});
$（“.summary”）.html（message.join（“，”）；
});
$（“输入：复选框”）。在（'click'，function（）上{
//在处理程序中，“this”是指单击的框
var$box=$（此项）；
如果（$box.is（“：checked”））{
//使用.attr（）方法检索框的名称
//因为它被假定和期望是不可变的
var group=“输入：复选框[name=”+$box.attr（“name”）+“]”；
//另一方面，组/框的选中状态将更改
//使用.prop（）方法检索当前值
$（组）.prop（“选中”，false）；
$box.prop（“选中”，为真）；
}否则{
$box.prop（“选中”，假）；
}
});
。选择区域{
边框：1px纯色灰色；
边缘底部：10px；
填充：10px；
}

根据需要选择这些选项中的任意多个
应该以数字顺序出现

第二


弗斯特


第四


选择摘要：
由于id是按您想要的顺序编号的，因此您可以按id对
$（'.mycheckbox:checked'）
进行排序。然后使用
$。每个
功能

$(".mycheckbox").on("change", function() {
  var message = [];
  $('.mycheckbox:checked').sort(function(a, b) {
    return parseInt(a.id) > parseInt(b.id);
  }).each(function() {
    var messagePart = $(this).attr('data-message');
    message.push(messagePart);
  });
  $(".summary").html(message.join(", "));
});

演示：

资源：
消息[数组位置]=messagePart插入到正确的插槽中，使插槽为空。。。然后在加入（）之前：
message.filter（布尔值）。加入（“，”
）以删除空插槽。您甚至不需要处理splice（）…如果您在第1节中选择了所有三个选项，那么第2节中的选项不在第四位吗？你的意思是说第2部分的选项总是最后一个吗？好的，我明白了，第二节是第一节中缺失的第三个位置。谢谢！第2节中的选项是什么？我尝试使用“数据顺序”而不是ID（因为我无法为该部分中的所有项目分配相同的ID），但是它们并不总是按顺序排列。我点击了好几次，有时按顺序结束，有时不按顺序结束。你是说第三名还是最后一名？不，是“在第二名和第四名之间”。必须在第1Add
id=“2”
节中的两个选项之间插入，并将其添加到这些复选框中。谢谢！成功了！我刚刚给了'first'1'，second'2'，fourth'100的ID，以及第二节中的不同选项一个介于两者之间的值！