Javascript 防止多个select元素根据选项中索引的顺序自动排序分配给它的值

我正在使用select2插件将一个multipleselecthtml元素转换成一种更具表现力的格式。我也不认为我的问题在很大程度上取决于插件

插件在内部的作用是-

this.select.val(val);

其中

this.select

指向隐藏的多选元素

在输入高于val的函数时，例如-2,4,0，
当我执行

警报（this.select.val（））

时，存储为已确认的值为0,2,4，即根据选择元素中选项的顺序自动进行不需要的排序/

演示-（感谢Mark）

将值输入到我的select元素后，是否有办法保持排序顺序？

---

谢谢。

这是一个非常好的问题。我认为这与multiselect html元素有关，而不是select2

如果你有一个正常的多选，没有“顺序”式的发言。您只需按原始顺序创建一个列表，选择或不选择每个项目

我几乎100%确信有一种比下面更好的方法，但是对于一种解决方法来说，它应该很好

最终结果：

JavaScript代码

// 'data' brings the unordered list, while 'val' does not
var data = $('#e1').select2('data');

// Push each item into an array
var finalResult = [];
for( item in $('#e1').select2('data') ) {
    finalResult.push(data[item].id);
};

// Display the result with a comma
alert( finalResult.join(',') );

JSFiddle:

---

回答有点晚，但我确实找到了一种方法

请记住，这个方法将隐藏已经选择的选项，因为对于我的用例来说，它看起来更好，而且它需要这样做，以便按照用户做出选择的顺序进行选择

$('.my-multi-select').select2('Your Options').on("select2:select", function (e) {
    $('[data-option-id="' + e.params.data.id + '"]').insertBefore(_this.find('option:not(:selected):eq(0)'));
}).on("select2:open", function () {
    _this.append(_this.find('option:not(:selected)').sort(function (a, b) {
        return +a.getAttribute('data-sort-order') - +b.getAttribute('data-sort-order');
    }));
});

至于风格呢

.select2-results__option[aria-selected=true]{
    display:none !important;
}

您需要确保知道jQuery

.sort（）

函数是如何工作的，以便能够根据自己的需要修改它

---

基本上，当您选择一个选项时，它会被隐藏，然后放置在其他选定选项的底部，这些选项位于未选定选项之前。当你打开下拉列表时，它会按照预先确定的排序顺序对所有未选择的选项进行排序。

对于那些想要帮助的人，JSFiddle：谢谢，这实际上需要一个小的编辑，现在我的问题被完全提出来了。嗨，马克，谢谢你的回复。虽然这确实有助于我获得正确的输出-我希望在页面上显示编辑结果的大图，需要使用some select2功能手动设置值。考虑使用与插件直接集成的隐藏字段将值发布到服务器。该字段的工作方式与父选择对象无关，只需在更改事件中使用所选值进行自我更新。提交前如何发送这些值？当我尝试但选择2时，继续还原列表。我应该添加硬编码的隐藏选择吗？然后在提交事件上使用jquery更新其值。然后将其与表单一起发送到服务器，而不是发送select2值？那么原来的select将被隐藏，而select2将仅在客户端？