select2选择后怎么按照选择先后顺序显示,而不是下拉列表的顺序显示
时间: 2024-02-24 09:59:27 浏览: 114
您可以使用select2的`data`属性来指定下拉列表中的选项,并通过设置`data`中每个选项的`order`属性来控制选项的显示顺序。具体实现方法如下:
1. 在`data`属性中添加选项,并设置每个选项的`order`属性,表示选项的显示顺序。例如:
```
<select id="mySelect2"></select>
<script>
$(document).ready(function() {
$('#mySelect2').select2({
data: [
{id: 1, text: '选项1', order: 2},
{id: 2, text: '选项2', order: 1},
{id: 3, text: '选项3', order: 3}
],
placeholder: '请选择'
});
});
</script>
```
2. 将select2的`sorter`属性设置为一个自定义函数,该函数将按照选项的`order`属性进行排序。例如:
```
<select id="mySelect2"></select>
<script>
$(document).ready(function() {
$('#mySelect2').select2({
data: [
{id: 1, text: '选项1', order: 2},
{id: 2, text: '选项2', order: 1},
{id: 3, text: '选项3', order: 3}
],
placeholder: '请选择',
sorter: function(data) {
return data.sort(function(a, b) {
return a.order - b.order;
});
}
});
});
</script>
```
这样,当用户选择选项后,选项将按照`order`属性的值进行排序并显示在选择框中。
阅读全文