如何从多选中获取最后选择的选项?

我正在寻找一种方法来使用jQuery以多选forms获取最后一个用户选择的选项。

我不是要查找列表中的最后一项,而是查找用户点击的最后一项。

像这样的东西

var lastSelected = null; $('.multiSelectOptions').click(function(){ lastSelected = this.value; }); 

当用户按住Ctrl并单击并选择多个项目时,如上面的答案中使用this.value失败 – 它返回列表中第一个选择的值,即使这不是最后一次单击。 试试这个:

 var previouslySelected = []; $("#myMultiselect").change (function() { // Get newly selected elements var currentlySelected = $(this).val(); var newSelections = currentlySelected.filter(function (element) { return previouslySelected.indexOf(element) == -1; }); previouslySelected = currentlySelected; if (newSelections.length) { // If there are multiple new selections, we'll take the last in the list var lastSelected = newSelections.reverse()[0]; } }); 

基本上你需要维护一个堆栈,以跟踪最后选择的项目。 我写了这个函数来更新我的堆栈。

 var determineLastSelectedReportNumber = function (selectedReportNumbers, oldSelectedReportNumbers) { var newlyAddedReportNumbers = selectedReportNumbers.filter(function (n) { return oldSelectedReportNumbers.indexOf(n) == -1; }); var removedReportNumbers = oldSelectedReportNumbers.filter(function (n) { return selectedNumberArray.indexOf(n) == -1; }); //Remove the removed reportNumbers from the stack. if (removedReportNumbers.length > 0) { removedReportNumbers.forEach(function (removedReportNumber) { for (var i = 0; i < selectedNumbersStack.length; i++) { if (selectedNumbersStack[i].toString() === removedReportNumber.toString()) { selectedNumbersStack.splice(i, 1); break; } } }); } //Add the added reportnumbers to the stack. Push(); if (newlyAddedReportNumbers.length > 0) { selectedNumbersStack.push(newlyAddedReportNumbers); } //Set the last selected from top of the stack. Peek(); var lastSelectedReportNumber = ""; if(selectedNumbersStack.length > 0){ lastSelectedReportNumber = selectedNumbersStack[selectedNumbersStack.length -1]; } return lastSelectedReportNumber; } 

这是我的onChange实现:

 var reportNumberChanged = function () { var $reportNumber = $(this); var selectedNumber = $reportNumber.val(); oldSelectedNumberArray = selectedNumberArray; selectedNumberArray = jQuery.makeArray(selectedNumber); var lastSelectedReportNumber = determineLastSelectedReportNumber(selectedNumberArray, oldSelectedNumberArray); $("#TheLastSelectedReportNumber").val(lastSelectedReportNumber); resetDelayRetrieveReportInfo(); } 

我不妨告诉你我的完整代码:

 var selectedNumberArray = jQuery.makeArray($('#SelectedReportNumbers').val()); //Initial selectedNumbersStack. var selectedNumbersStack = selectedNumberArray; var counterInitialValue = 3; var counter = counterInitialValue; var counterInterval = -1; function delayRetrieveReportInfo() { counter--; if (counter === 0) { retrieveReportInfo($("#TheLastSelectedReportNumber").val()); clearInterval(counterInterval); } } function resetDelayRetrieveReportInfo() { clearInterval(counterInterval); //The previous interval is cancelled. counter = counterInitialValue; counterInterval = setInterval(function () { delayRetrieveReportInfo() }, 1000); } 

这是多选的连接:

 // Hookup function to change events of select lists $('#SelectedReportNumbers').change(reportNumberChanged); 

您可以重复使用我的一些代码来创建自己的“lastSelected”实现。