我使用的获选的多项选择。 我希望能够跟踪用户选择的顺序。 例如，如果用户选择选项2第一，然后选项1，我想要得到的结果选项2和选项1的顺序。 但是，选择各种用户选择的选项。 有没有我可以告诉选择了不排序结果的方式吗？
Answer 1:
我写了一个简单的插件与拣选一起使用。 它允许您检索选定多个选择元素的选择顺序 ，还从值的有序阵列设置 。
它可以在Github： https://github.com/tristanjahier/chosen-order
它与选上的1.0+以及带jQuery和原型版本兼容。 还有每个框架，它让你做这样的事情一个插件：
检索选择顺序
var selection = $('#my-list').getSelectionOrder();
设置以选定的值
var order = ['nioup', 'plop', 'fianle']; // Ordered options values
$('#my-list').setSelectionOrder(order);
看看这个。
Answer 2:
我建议你用选择二 ，如果它是不是为时已晚。 它看起来一样的选择的，但有一个更好的方式API和文档。
随着选择2，它会是这样的[未经测试的代码]
var results = [];
$("#e11").on("change", function(e) {
results.push(e.val)
})
Answer 3:
有一个https://github.com/mrhenry/jquery-chosen-sortable/插件现在可用，这确实为选择V1的工作。
对于选择新的版本，你需要chosen-更换chzn-在GitHub的JS文件。
要使用，就我使用下面的代码：
jQuery('#myselect').addClass('chosen-sortable').chosenSortable();
它工作得很好，但你会需要一些更多的代码，重新编辑场时，重新排序后选择的元素已加载。
我用这个以下。 鉴于sortedElements列表和$选择=的jQuery（ '＃myselect'）：
var $container = $select.siblings('.chosen-container')
var $list = $container.find('.chosen-choices');
// Reverse the list, as we want to prepend our elements.
var sortedElements = sortedElements.reverse();
for (var i = 0; i < sortedElements.length; i++) {
var value = sortedElements[i];
// Find the index of the element.
var index = $select.find('option[value="' + value + '"]').index();
// Sort the item first.
$list
.find('a.search-choice-close[data-option-array-index="' + index + '"]')
.parent()
.remove()
.prependTo($list);
}
这个作品非常好这里。
Answer 4:
您可以添加/删除自己的项目上更改事件。
// Your collection Array
var collectionArray = []
// make change event on chosen select field
chosenSelect.change(function () {
// first get the chosen results which might be in wrong order
var currentValues = $(this).val();
// get your current collection that is in the right order
var pastValues = collectionArray;
// see if you need to add or drop
if (currentValues.length > pastValue.length) {
// loop to get just the new item
pastValues.forEach(function(pastValue) {
currentValue = $.grep(currentValue, function(newItemOnly) {
return newItemOnly != pastValue;
});
});
// add your newItemOnly
collectionArray.push(currentValue[0]);
} else {
// here loop to get only the dropped value
currentValues.forEach(function(currentValue) {
pastValues = $.grep(pastValues, function(droppedValueOnly) {
return droppedValueOnly != currentValue;
});
});
// drop the value dropped from your collection
collectionArray = $.grep(collectionArray, function(updatedArray) {
return updatedArray != pastValues[0];
});
}
});
Answer 5:
我注入了定制.change()事件处理程序，使其工作：
$('.chosen-select').chosen({});
至：
$('.chosen-select').chosen({}).change((event, info) => {
if (info.selected) {
var allSelected = this.querySelectorAll('option[selected]');
var lastSelected = allSelected[allSelected.length - 1];
var selected = this.querySelector(`option[value="${info.selected}"]`);
selected.setAttribute('selected', '');
lastSelected.insertAdjacentElement('afterEnd', selected);
} else { // info.deselected
var removed = this.querySelector(`option[value="${info.deselected}"]`);
removed.setAttribute('selected', false); // this step is required for Edge
removed.removeAttribute('selected');
}
$(this).trigger("chosen:updated");
});
注意：此动作中选择的情况下的DOM和取消选择的情况下，没有动静。 该setAttribute / removeAttribute是带来的明显变化<option> DOM。
希望这有助于有人仍然在寻找一种方式来做到这一点没有做对提交额外的东西。
PS：这个代码的紧凑jQuery的版本如果需要，可以写的。 :)
Answer 6:
希望这是谁使用选择2的旧版本（小于V4）人有用。 选择2，选择和选择2移除选项在这种情况下有帮助。 使用阵列和附加的值，一旦我们选择，可维持选择的顺序和同时取消选择特定选项，我们可以找到索引并使用拼接从数组中取出（）。
var selected = [];
$('#multiSelect').on("select2-selecting", function(evt) {
var selectedOption = evt.val;
selected.push(selectedOption);
}).on("select2-removing", function(evt) {
index = selected.indexOf(evt.val);
selected.splice(index,1);
});
对于4以上的版本，SELECT2：选择和SELECT2：取消选择可以使用。 :)
Answer 7:
这将在您选择的顺序安排
$("select").on('select2:select', function (e) {
var elm = e.params.data.element;
$elm = jQuery(elm);
$t = jQuery(this);
$t.append($elm);
$t.trigger('change.select2');
});
文章来源: Chosen: Keep Multiple Selection Order
