Javascript 从表中选择随机行，然后删除该行并使用该行创建新表？

我找到了一些代码，帮助我接近目标。真是太好了！这就是我要做的。有一个表，其中包含赠品的条目行。我希望能够单击一个按钮，从表中删除该行，并使用从主表中拾取的随机行动态生成一个新表

现在，下面的代码选择一个随机行并用深蓝色高亮显示。这很好。问题是它还将和作为随机选取中的行进行计数，理想情况下不会。这没什么大不了的。但一旦我开始工作，我就可以随心所欲了。现在的问题是，当条目的日志变得很长时，很难跟踪谁先被选中

关于如何通过Javascript实现这一点，有什么想法吗

    <table id="cp_logs_table" class="widefat" style="background-color:#333;color:#ddd;font-weight:bold;margin:15px;">
    <thead><tr><th scope="col">Name [Username]</th><th scope="col">Points</th><th scope="col">Entry Type</th><th scope="col">Time</th></tr></thead>
    <tfoot><tr><th scope="col">Name [Username]</th><th scope="col">Points</th><th scope="col">Entry Type</th><th scope="col">Time</th></tr></tfoot>
    <tr>
    <td title="wolfkin">wolfkin [wolfkin]</td>
    <td>- 150</td>
    <td>
    Lottery Ticket
    </td>
    <td title="2011-10-14 17:20:29">11 hours ago</td>
    </tr><tr>
    <td title="dragon290513">dragon290513 [dragon290513]</td>
    <td>+ 5</td>
    <td>
    Video Entry
    </td>
    <td title="2011-10-14 01:42:30">1 day ago</td>
    </tr></table>

            <script>
            function cplottopickwinner() {      
             // get all TRs that are descendants of table#cp_logs_table:
             var tds = document.getElementById("cp_logs_table").getElementsByTagName("tr");
             // get a random int between 0 (inclusive) and tds.length (exclusive)
             var rand = Math.floor( Math.random() * tds.length );
             // highlight tr at that index
             tds[rand].style.backgroundColor = "#375297";
             //tds[rand].style.color = "#000";      
            }
            </script>

<a href="javascript:cplottopickwinner()">Pick Random Winner(s)</a>

我将函数修改为下面的代码，但它没有用任何东西填充表，但仍然用蓝色突出显示表行。我确信我缺少了一些简单的东西，可以自动删除该行并将其添加到新表中

    function cplottopickwinner() {      
     // get all TRs that are descendants of table#cp_logs_table:
     var tds = document.getElementById("cp_logs_table").getElementsByTagName("tr");
     // get a random int between 0 (inclusive) and tds.length (exclusive)
     var rand = Math.floor( Math.random() * tds.length );
     // highlight tr at that index
     tds[rand].style.backgroundColor = "#375297";
     //tds[rand].style.color = "#000";       
     jQuery("#cb_winners").fadeIn("slow");
     var html = tds[rand].html();
     tds[rand].remove();
     jQuery("#winners").append("<tr>"+html+"</tr>");
    }

---

我用jQuery做的。。希望对你有帮助

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>


<table id="cp_logs_table" class="widefat" style="background-color:#333;color:#ddd;font-weight:bold;margin:15px;">
    <thead><tr><th scope="col">Name [Username]</th><th scope="col">Points</th><th scope="col">Entry Type</th><th scope="col">Time</th></tr></thead>
    <tfoot><tr><th scope="col">Name [Username]</th><th scope="col">Points</th><th scope="col">Entry Type</th><th scope="col">Time</th></tr></tfoot>
    <tr>
        <td title="wolfkin">wolfkin [wolfkin]</td>
        <td>- 150</td>
        <td>Lottery Ticket</td>
        <td title="2011-10-14 17:20:29">11 hours ago</td>
        <td><input type='submit' value='MOVE' class='move'></td>
    </tr>
    <tr>
        <td title="dragon290513">dragon290513 [dragon290513]</td>
        <td>+ 5</td>
        <td>Video Entry</td>            
        <td title="2011-10-14 01:42:30">1 day ago</td>
        <td><input type='submit' value='MOVE' class='move'></td>
    </tr>
    </table>

<script>
$('.move').click(function(){
    var row = $(this).parent('td').parent('tr');
    var html = row.html();
    row.remove();
    $('#winners').append("<tr>"+html+"</tr>");
});
</script>

<table id='winners' ></table>

---

如果你还有一张桌子要放优胜者

<table>
    <thead><!-- .... --></thead>
    <tfoot><!-- .... --></tfoot>
    <tbody id="winners"></tbody>
</table>

---

我正在测试它，效果很好！谢谢你的回复。我希望看到当我随机挑选一个赢家时自动完成。但事实上他自己也很酷。干得好实际上，我对它做了一些调整，使winners表在默认情况下隐藏，并在添加第一行时淡入。哎呀！把你的随机化脚本编入其中应该不会太难。。是吗？仍然在学习jQuery，所以不知道如何将其结合在一起。但是由于随机脚本当前从所有行中选择随机行，包括thead。这可能会自动将thead tr放入新表中。。嗯，这正是我要找的！谢谢,谢谢!！我能想到的唯一另一件事就是，在挑选赢家之前，只需点击一下，就可以洗牌桌子上的行。但这很好。我喜欢。再次感谢你。一个简单的算法：假设你有5行要挑选，你可以随机挑选前5行中的一行并将其发送到表的末尾，然后你还有4行要挑选，选中的一行现在在表的末尾，所以不要再挑选它。从前4行中选择一行并发送它，然后您还有3行要选择。继续选择一行并将其发送到末尾，直到您没有更多的行可选择。我实际上使用了这个jQuery插件，它工作得非常好！

document.getElementById('winners').appendChild(trs[rand]);