请看这个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>
........
以下代码无效。输出有点乱。正如您在 fiddle 中看到的,我无法访问 key (数字),并且 <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)
最佳答案
不正确的标题是因为迭代函数的参数在第一个 .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()
, 所以我删除了它。
关于javascript - 将一个数组分成几个 block ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24726279/