Question

我有一些jQuery禁用了一系列选择选项（跨多个下拉菜单）。

我正在尝试获取这些禁用选项的列表。我没有在选项更改时让列表更新，我的列表当前只是不断填充新的禁用选项，并且不会删除新重新启用的选项。

请帮助：http://jsfiddle.net/Webby2014/y858g/2/

$(function () {
var previous;

$(".openTeam").on('focus', function () {
    // Store the current value on focus and on change
    previous = this.value;
}).on('change', function () {
    var excludedPlayers = '';

    // Get the filter value
    var filterVal = $(this).val().substr(0, 3);
    var selector = 'option[value^="' + filterVal + '"]';

    others = $('.openTeam').not(this).find(selector);
    others.prop('disabled', true);

    // Now loop through and enable previous
    var oldFilterVal = previous.substr(0, 3);
    var oldSelector = 'option[value^="' + oldFilterVal + '"]';

    $('.openTeam').find(oldSelector).prop('disabled', false);

    //FAILED ATTEMPT 1:
    //var test = $('#warning-message > div').find(oldSelector).remove();

    //FAILED ATTEMPT 2:
    /*
    var disabledPlayers = $('.openTeam option:disabled').val();      
    $('#warning-message').append('<div value="' + disabledPlayers + '">' + disabledPlayers + '</div>');
    */

    var myArray = others.text().split(')');

    for (var i = 0; i < myArray.length; i++) {
        $('#warning-message').append('<div value="' + myArray[i] + ')' + '">' + myArray[i] + ')</div>');
    };

});

});

Answer 1

嗯，我可能会改变一些事情。首先，我将previous变量的赋值绑定到焦点事件，而不是click事件。否则，在列表已经处于焦点时更改选定的播放器将不会更改先前的变量，从而导致重新启用先前禁用的播放器时出现问题。因此，您的事件绑定看起来像这样：

$(".openTeam").on('click focus', function () {
    ...
}).on('change', function () {
    ...
});

现在，为了更新残疾玩家的名单...我最喜欢你的第二次失败的方法，所以我决定扩展它（希望你不介意我放弃了你最近的尝试！）。主要是，只使用jQuery的.empty()和.each()清除原始列表，然后遍历每个<option>以生成新的禁用播放器列表：

$('#warning-message').empty();
var disabledPlayers = $('.openTeam option:disabled');
console.log(disabledPlayers.length);
disabledPlayers.each(function(){
    $('#warning-message').append('<div value="' + $(this).val() + '">' + $(this).val() + '</div>');
});

这是一个显示所有实现代码的JSFiddle。希望这可以帮助！如果您有任何问题，请告诉我。

显示更改已禁用选项的列表

1 个答案: