javascript - 使用 JQuery 禁用 5 个选择列表之间的选定选项

Question

我的 HTML 页面中有 5 个选择框，我试图禁用其他已选择的选择框中的所有选项，取消选择时也必须重新启用它们。

到目前为止，我得到了这个结果:Click here for JSFiddle

使用这个 JQuery

$('.poli').on('keyup change', function () {
$(this)
    .siblings('select')
    .children('option[value=' + this.value + ']')
    .attr('disabled', true)
    .siblings().removeAttr('disabled');
});

然而，这并不能很好地工作，它一次只能选择和禁用 1 个选项...

有什么解决办法吗？

Answer 1

你可以使用:

DEMO

$('.poli').on('keyup change', function () {
    var selectedValues = $('.poli').find('option:selected').map(function () {
        return this.value ? this.value : null;
    });
    $('.poli').filter(function () {
        return !this.value
    }).find('option').each(function () {
        $(this).prop('disabled', ~$.inArray(this.value, selectedValues));
    });
});