请查看此fiddle。
如何将数组切割成几个小数组
var data =
[ { number: '1' },
{ number: '2' },
{ number: '3' },
{ number: '4' },
{ number: '5' },
{ number: '6' },
{ number: '7' },
{ number: '8' },
{ number: '9' },
{ number: '10'}
];
为每个人建一张桌子? 例如:
<table>
<thead>
<tr>
<th>Number</th><th>Number</th><th>Number</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td><td>2</td><td>3</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th>Number</th><th>Number</th><th>Number</th>
</tr>
</thead>
<tbody>
<tr>
<td>4</td><td>5</td><td>6</td>
</tr>
</tbody>
</table>
........
以下代码无效。输出有点混乱。正如您在小提琴中看到的那样,我无法访问密钥(数字),并且表之间有空<table></table>
个标记。任何人都可以告诉我如何正确地切割阵列。
代码:
var data = [ { number: '1' },
{ number: '2' },
{ number: '3' },
{ number: '4' },
{ number: '5' },
{ number: '6' },
{ number: '7' },
{ number: '8' },
{ number: '9' },
{ number: '10'}
];
var chunks = [];
var item_html ="";
for (var i=0; i<data.length; ) {
chunks.push(data.slice(i, i+=3));
}
for (var i=0; i<chunks.length; i++) {
item_html += "<table><thead><tr>";
(i, chunks[i].map(function(key,v){
item_html += "<th>"+key+"</th>";
}));
item_html += "</tr></thead><tbody><tr>";
(i, chunks[i].map(function(v){
item_html += "<td>"+v.number+"</td>";
}));
item_html += "</tr></tbody><table>";
}
$('#area').append(item_html)
答案 0 :(得分:2)
不正确的标题是因为您在第一次.map()
调用中以错误的顺序拥有迭代函数的参数。第一个参数是值,第二个参数是键。它应该是:
chunks[i].map(function (v, key) {
空表是因为拼写错误。这一行:
item_html += "</tr></tbody><table>";
应该是:
item_html += "</tr></tbody></table>";
您错过了/
中的</table>
。
更正的循环是:
for (var i = 0; i < chunks.length; i++) {
item_html += "<table><thead><tr>";
chunks[i].map(function (v, key) {
item_html += "<th>" + key + "</th>";
});
item_html += "</tr></thead><tbody><tr>";
chunks[i].map(function (v) {
item_html += "<td>" + v.number + "</td>";
});
item_html += "</tr></tbody></table>";
}
每次拨打(i, ...)
时,您都没有额外的.map()
,所以我将其删除了。