10

我有许多选择框已设置为接受多个值。无论如何，我可以使用 jQuery 来获取最后选择的值吗？我尝试过使用以下内容：

var latest_value = $("option:selected",this).val();

它什么也没返回。我只想要最后一个选择的值而不是值数组。

先感谢您

按照这里的要求，我已经将列表剪掉了，因为它太长了：

<select id="style-list" name="style-list[]" class="attrs" multiple="multiple">
    <option value="7">2 Pack</option>
    <option value="10">3 Pack</option>
    <option value="12">4 Pack</option>
</select>

然后在页面顶部我有以下内容（我有 8 个，但我展示了一些，以便您可以看到我正在使用多选小部件的多个实例：

$(document).ready(function(){

    $("#product-list").multiselect({
       selectedList: 4,
       noneSelectedText: "Product",
       minWidth: 190  
    }).multiselectfilter();

    $("#style-list").multiselect({
       selectedList: 4,
       noneSelectedText: "Style",
       minWidth: 190  
    }).multiselectfilter();


    $("#feature-list").multiselect({
       selectedList: 4,
       noneSelectedText: "Features",
       minWidth: 190  
    }).multiselectfilter();

});

然后我在一个单独的 js 文件中有这个：

$(function(){

    $(".attrs").on("multiselectclick", function(event, ui){

    var latest_value = $('option', this).filter(':selected:last').val(); 
    alert (latest_value);

    var view = $("#currentview").val();
    var page = 1;

    run_ajax(view,page);

    });

})

谢谢

4

5 回答 5

15

Use the :last selector:

var latest_value = $("option:selected:last",this).val();

It may be that this in the context of the callback function doesn't refer to the <select> element itself, but instead to an element within it, so try the following:

var latest_value = 
$(this).closest('select').find('option').filter(':selected:last').val();

It may also be worth calling console.log(this); inside the callback function, just so you know what element you're actually working with.

于 2012-05-04T22:36:33.213 回答
5

使用最后一个函数：像这样

$("#style-list option:selected").last().val()
于 2015-12-14T10:10:15.193 回答
3

这是使用 Jquery 从多个选择列表中获取最新选择的选项的代码：

var selected;
$(document).ready(function() {
$('#SELECT_ID').on('click', function() {
var latestSelected;
if (selected) {
    var currentOptionsValue = $(this).val();
    latestSelected = currentOptionsValue.filter(function(element) {
    return selected.indexOf(element) < 0;
  });
}
selected = $(this).val();
console.log( "latest selected option : " + latestSelected);
});
});
于 2017-03-19T14:09:20.057 回答
2

是的，正如@KannanK 所说，上面的答案没有给出正确的值，因为它是根据下拉显示顺序存储值，所以如果从下到上选择，则会给出错误的值。

我有一个更好的逻辑来实现这一点。下拉列表的每次更改都会存储到一个全局变量中，这样我们就可以在differOpt变量中获得最后选择的值。

var lastSelectedValues = [];
$('#yourID').change(function(e) {
    debugger;
    var currentSelVals = $('#yourID').val();
    var differOpt =arr_diff(currentSelVals,lastSelectedValues);
    lastSelectedValues = currentSelVals;
});
function arr_diff (a1, a2) {
    var a = [], diff = [];
    for (var i = 0; i < a1.length; i++) {
        a[a1[i]] = true;
    }
    for (var i = 0; i < a2.length; i++) {
        if (a[a2[i]]) {
            delete a[a2[i]];
        } else {
            a[a2[i]] = true;
        }
    }
    for (var k in a) {
        diff.push(k);
    }
    return diff;
}

更新一个更好的解决方案 ，我们可以使用 onChange 选项它提供正确的值或者选择/取消选择

$(function () { $('#datadownAutpState').multiselect(
    onChange: function(option, checked) {
        alert(option.val + ' option ' + (checked ? 'selected' : 'deselected'));
    }
});});
于 2018-07-19T11:16:45.493 回答
0

据我了解，您只需要稍微更新您的 JS 文件

$(function(){

    $(".attrs").on("multiselectclick", function(event, ui){

        var latest_value = ui.value; 
        alert (latest_value);

        var view = $("#currentview").val();
        var page = 1;

        run_ajax(view,page);

    });

})

第二个参数ui具有以下值：

{
    value: 'some value',
    text: 'option label',
    checked: true //whether option is selected or deselected
}
于 2022-01-11T16:37:49.090 回答