精选框的jquery插件

Question

如您所知，selectbox有许多jquery插件，这使得selectboxes /下拉菜单更加美观。

我正在寻找一个，可以立即更新其他选择框的选项。

原因是，我写了一个足球经理游戏，现在是阵容部分

这是指向屏幕截图的链接：

所以，使用下拉菜单的经典风格，如果我拿一个玩家，那么这个玩家将在其他选择元素中被禁用，所以没有问题。

但是，当我想使用jQuery插件使菜单更漂亮时，如果我选择一个播放器，则不再禁用这些选项。

我已经尝试了 ddSlick 和this one，但如果选择一个播放器，则其他选项的选项不再被禁用。

所以我现在要求一个漂亮的插件，它可以立即禁用其他选项。

这是我的代码，用于停用其他选项，如果您需要：

var player1 = select = document.getElementById( 'player1' );
var player2 = select = document.getElementById( 'player2' );
// More...

var string1 = null;
var string2 = null;
// More...

function preventDupes( select) {
    var options = select.options,
        len = options.length;
    while( len-- ) {
        if ((options[len].value == string1 ||
             options[len].value == string2 ||
             /*More...*/ )){

                options[ len ].disabled = true;
        }
        else{
            options[ len ].disabled = false;
        }

    }
    //select.options[ index ].disabled = true;
}

player1.onchange = function() {

    string1 = player1.options[this.selectedIndex].value;
    preventDupes.call(this, player2);
    // more player...
};

player2到player10的功能仍然与player1.onchange()

相同

Answer 1

这是一个非常简单的jsFiddle，可以满足您的需求，并且可以与许多玩家合作。循环中的循环最终会降级，我知道有更好的方法可以做到这一点，但是现在已经很晚了，这很有效......

为了安抚SO众神，你应该使用数组而不是单独的变量

   var players = ["player1", "player2", "player3", "player4", "player5"];

See my example here