0

我正在尝试开发一个足球队线功能，该功能将使用每个球员的选择框最多存储 18 名球员（11 名首发球员和 7 名替补球员）。

当从一个选择框中选择玩家时，他们应该隐藏在所有其他选择框中，以阻止用户再次选择同一玩家。

我已经编写了一个 javascript/jquery 函数来执行此操作，但它非常冗长，我猜想让它更易于管理的最佳选择是编写一个 while 循环，但我试图让自己感到困惑编码。

当前代码（用于起始 XI）可以在http://jsfiddle.net/aFDjS/看到

我是否正确地认为我需要做的可能是将一个while循环嵌套在另一个while循环中，以便在计数与玩家编号相同时忽略这种情况......

i = 1;
playerNo = 1;
while (i < 19) {        
    while (playerNo < 19 && i != playerNo) {
        playerID = $("#player" + i + "Name option:selected").val();
        $("select#player" + playerNo + "Name >option" ).filter( "[class='"+ playerID +"']" ).hide();
        $("select#player" + playerNo + "Name >option" ).filter( "[class!='"+ playerID +"']" ).show();
        playerNo++;
    }
    i++;
}

这是正确的路线吗？

4

3 回答 3

0

不，您应该使用for循环。

标准是for在计数时使用循环，while在等待事件或值更改时使用循环。

那些 for 循环中的逻辑很难理解，而且无论如何看起来都是错误的。

但不管怎样，最简单的方法是使用 jquery 的强大功能：

$(function() {
    $("select").on("change", function() {
        //reset to showing all the options
        $("select option").show(); 

        //for each selected option
        $("select option:selected").each(function() {
            var optionSelected = this;
            var playerID = $(this).attr("class");
            //hide the option in all the other dropdowns
            $("option." + playerID).each(function() {
                if(this != optionSelected) {
                    $(this).hide();
                }
            });
        });
    });
});

这里的工作示例：

http://jsfiddle.net/4avwm/1/

于 2013-02-12T11:38:38.510 回答
0

可能这会给你实现的想法：http: //jsfiddle.net/2jGDU/

$('#players').change(function () {
   $('#pl_11').prepend($('option:selected', this).clone());
   $('option:selected', this).remove();
   if ($('option', this).length <= 8) {
    $('option:first', this).remove();
    $('#sub').prepend($(this).html());
    $('option', this).remove();
   }
});
于 2013-02-12T11:46:11.113 回答
0

好吧，不知道程序的完整概念是什么，但我认为您的解决方案有点矫枉过正。
我会给每个复选框一个名称（例如：）"plr"+ID，然后我会为其附加一个 onclick 事件。触发事件时，复选框将搜索所有同名复选框并禁用它们。 

 function selectPlr(event) {
     var other = document.getElementsByName(this.name);  //Get element collection
     for(var i=0; i<other.length; i++) {
       if(other[i]!=this) {  //Ignore itself
         other[i].disabled = this.checked;   //Disable if the player is picked, enable if unpicked
       }
     }
 }

当然，也可以使用类名：

 var other = $("input."+this.className);

这是活动代码。

于 2013-02-12T11:25:08.403 回答