Question

我正在学习javascript和jquery，但在下面的代码中遇到问题。基本上我有一个主列表中的玩家列表，当双击主列表时，它应该添加到具有最少玩家数量的团队。 appendTo子句似乎不起作用。我是否滥用其中的变量或以某种方式错误地指向DOM？当我硬编码团队的价值时，它将起作用。我只使用警报来查看currentteam的值是否正确传递到该点，它是。但是在appendTo子句中它不起作用。

  Note I tried to create a JSFiddle but it didn't run correctly. i even tried copying the actual sortable jquery example from their site. Again it didn't run.

在我的例子中，我有一份球员名单，可以被选入各个球队。我还没有完成所有检查。但是稍后会添加。现在我希望能够拖动或双击以让玩家移动。

我不确定为什么当我双击时，如果我在appendTo子句中有currentTeam，那么玩家不会移动到列表但是如果我硬编码team3，那么双击将添加玩家那个地方。我显然不想对这个值进行硬编码。

如果我需要更好的编辑，我会很感激，或者如果有人能够在JSFiddle中使用它，这将很酷。

<style>
    div#info {width:1000px;}
    div#contentarea {width:1000px; border:solid 1px blue;}
    div#draftlist {width:334px; float:left;}
    div#column1 {width:333px; float:left;}
    div#column2 {width:333px; float:left;}
    .connectedSortable, .sortable,  {list-style-type: none; border: solid 1px black; margin: 0; padding: 0 0 2.5em; width: 333px; }
</style>

<script>

    $(function() {
        $("#masterlist").sortable({
            connectWith: ".sortable"
        }).on("dblclick", "li", function(){
            var numberOfPlayers = null;
            var currentTeam = null; 
            $('.sortable').each(function () {
                var currentNumberOfPlayers = $(this).children("li").length; 
                if (numberOfPlayers === null || numberOfPlayers > currentNumberOfPlayers) {
                    numberOfPlayers = currentNumberOfPlayers;
                    currentTeam = $(this).attr('id');
                }
            })

            alert("current team is " + currentTeam);

            $(this).appendto(currentTeam).ul; // doesn't work
            // $(this).appendto(team3).ul would work but don't want it hard coded value
        });


    $( "#team1, #team2, #team3" ).sortable({

        connectWith: ".connectedSortable",

        receive: function (event, ui) {

            if(($(this).find('li').length) >5) {
                $(ui.sender).sortable('cancel');
            }

        }

    }

    ).disableSelection();


  });
  </script>




<body>
<DIV id="contentarea">



<DIV id="draftlist">
DRAFT LIST:
<ul id="masterlist" class="connectedSortable">
<li>Player One</li>
<li>Player Two</li>
<li>Player Three</li>
<li>Player Four</li>
<li>Player Five</li>
</ul>
</DIV>

<DIV id="column1">
TEAM ONE:
<ul id="team1" class="sortable">
</ul>

TEAM TWO:
<ul id="team2" class="sortable">
</ul>

TEAM THREE:
<ul id="team3" class="sortable">
</ul>

</DIV>

</DIV> <!-- end main content area -->

JQuery - 变量未正确传递

0 个答案: