我正在尝试创建一个通过足球比赛（小组赛阶段+淘汰金字塔）进行分类的拖放游戏。
这是动态生成组阶段表+排序的代码 功能：
function drawTable() {
var table_string = "<tr>";
for (var k=1; k<=8; k++) {
table_string+="<td><table id ='id"+k+"' class='floating'>";
for ( var i=1; i<=4; i++ ) {
table_string+="<tr>";
table_string+="<td class='team_td' id='item"+i+""+k+"'></td>"
table_string+="</tr>";
}
table_string+="</table></td>";
}
table_string+="</tr>"
$("#groupStage").append(table_string);
}
function randomizeTable() {
var Teams = ["ALG", "ARG", "AUS", "BEL", "BOS", "BRA", "CAM", "CDI",
"CHI", "COL", "CRC", "CRO", "ECU", "ENG", "FRA", "GER", "GHA",
"GRE", "HON", "IRA", "ITA", "JPN", "KOR", "MEX", "NED", "NIG", "POR", "RUS", "SPN", "SWI", "URU", "USA"];
shuffleArray(Teams);
var contor=0;
for ( var i=1; i<=4; i++ ) {
for ( var j=1; j<=8; j++ ) {
$("#item"+i+""+j).append("<img src='Pics/"+Teams[contor]+".bmp'
/>");
contor++;
}
}
}
function shuffleArray(array) {
for (var i = array.length - 1; i > 0; i--) {
var j = Math.floor(Math.random() * (i + 1));
var temp = array[i];
array[i] = array[j];
array[j] = temp;
}
return array;
}
现在我无法弄清楚如何将每列中的前两个td导入到另一个表中（使用A1播放B2和A2播放B1等规则）。
是否应该使用新数组映射移动并使用innerHtml？
答案 0 :(得分：0)
类似这样的事情： -
var groups = $('#groupStage').find('table.floating');
for (var i = 0; i < groups.length; i += 2) {
var aFirst = $(groups[i]).find('.team_td:eq(0)').get(0);
var aSecond = $(groups[i]).find('.team_td:eq(1)').get(0);
var bFirst = $(groups[i + 1]).find('.team_td:eq(0)').get(0);
var bSecond = $(groups[i + 1]).find('.team_td:eq(1)').get(0);
$('body').append('<div>' + aFirst.id + ' v ' + bSecond.id + '</div>');
$('body').append('<div>' + bFirst.id + ' v ' + aSecond.id + '</div>');
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="groupStage">
<tbody>
<tr>
<th>Group A</th>
<th>Group B</th>
<th>Group C</th>
<th>Group E</th>
<th>Group F</th>
<th>Group G</th>
<th>Group H</th>
<th>Group I</th>
</tr>
<tr>
<td>
<table id="id1" class="floating">
<tbody>
<tr>
<td class="team_td" id="item11">
11
</td>
</tr>
<tr>
<td class="team_td" id="item21">
21
</td>
</tr>
<tr>
<td class="team_td" id="item31">
31
</td>
</tr>
<tr>
<td class="team_td" id="item41">
41
</td>
</tr>
</tbody>
</table>
</td>
<td>
<table id="id2" class="floating">
<tbody>
<tr>
<td class="team_td" id="item12">
12
</td>
</tr>
<tr>
<td class="team_td" id="item22">
22
</td>
</tr>
<tr>
<td class="team_td" id="item32">
32
</td>
</tr>
<tr>
<td class="team_td" id="item42">
42
</td>
</tr>
</tbody>
</table>
</td>
<td>
<table id="id3" class="floating">
<tbody>
<tr>
<td class="team_td" id="item13">
13
</td>
</tr>
<tr>
<td class="team_td" id="item23">
23
</td>
</tr>
<tr>
<td class="team_td" id="item33">
33
</td>
</tr>
<tr>
<td class="team_td" id="item43">
43
</td>
</tr>
</tbody>
</table>
</td>
<td>
<table id="id4" class="floating">
<tbody>
<tr>
<td class="team_td" id="item14">
14
</td>
</tr>
<tr>
<td class="team_td" id="item24">
24
</td>
</tr>
<tr>
<td class="team_td" id="item34">
34
</td>
</tr>
<tr>
<td class="team_td" id="item44">
44
</td>
</tr>
</tbody>
</table>
</td>
<td>
<table id="id5" class="floating">
<tbody>
<tr>
<td class="team_td" id="item15">
15
</td>
</tr>
<tr>
<td class="team_td" id="item25">
25
</td>
</tr>
<tr>
<td class="team_td" id="item35">
35
</td>
</tr>
<tr>
<td class="team_td" id="item45">
45
</td>
</tr>
</tbody>
</table>
</td>
<td>
<table id="id6" class="floating">
<tbody>
<tr>
<td class="team_td" id="item16">
16
</td>
</tr>
<tr>
<td class="team_td" id="item26">
26
</td>
</tr>
<tr>
<td class="team_td" id="item36">
36
</td>
</tr>
<tr>
<td class="team_td" id="item46">
46
</td>
</tr>
</tbody>
</table>
</td>
<td>
<table id="id7" class="floating">
<tbody>
<tr>
<td class="team_td" id="item17">
17
</td>
</tr>
<tr>
<td class="team_td" id="item27">
27
</td>
</tr>
<tr>
<td class="team_td" id="item37">
37
</td>
</tr>
<tr>
<td class="team_td" id="item47">
47
</td>
</tr>
</tbody>
</table>
</td>
<td>
<table id="id8" class="floating">
<tbody>
<tr>
<td class="team_td" id="item18">
18
</td>
</tr>
<tr>
<td class="team_td" id="item28">
28
</td>
</tr>
<tr>
<td class="team_td" id="item38">
38
</td>
</tr>
<tr>
<td class="team_td" id="item48">
48
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>