javascript - 使用多维数组 javascript 中的数据填充表的列

Question

我正在尝试用 moment.js 对象填充表格，并在每列上添加每个日期的值。我试图填充表格的数组如下所示:

[['8th Jan 11AM', '8th Jan 12AM'],['9th Jan 11AM', '9th Jan 12AM'],['10th Jan 11AM', '10th Jan 12AM']]

我正在创建该数组:

for (var i = 0; i < 7; i++) {
    thisMoment = moment().day(i);

    var dayDateStamps = [];
    for (var j = 0; j < 12; j++) {
        dayDateStamps.push(thisMoment.startOf('day').add(j + 6, 'hours').format('lll'));
    }
    dateStamps.push(dayDateStamps);

}

为了生成表格，我正在这样做:

function bodyFromDateStamps(dateStamps) {
    var tbody = document.getElementsByTagName('tbody')[0];
    for(var i = 0; i < countMultiArray(dateStamps); i++) {
        if (i % 7 == 0) {
            row = tbody.insertRow(tbody.rows.length);
        }
        row.insertCell(i % 7).innerHTML = dateStamps[i % 7][i];
    }
}

function countMultiArray(array) {
    var iter = 0
    for (var i = 0; i < array.length; i++) {
        for (var j = 0; j < array[i].length; j++) {
            iter += 1
        }
    }
    return iter;
}

但是，目前我得到的是:

我得到了正确数量的单元格 (84)，但是内容在“小时”循环的 1 次迭代后停止。我不知道我哪里出了问题。

如何解决这个问题？是否有更好的方法来解决这个问题？ 非常感谢任何帮助!

Answer 1

问题是生成表。

您正在从 0 迭代到 83，并尝试通过该 i 访问内部数组。您正在使用模数正确访问第一个数组，但第二个数组索引也应该绑定(bind)到 0-6 值索引，因此请执行以下操作:

row.insertCell(i % 7).innerHTML = dateStamps[i % 7][Math.floor(i/12)];

Math.floor(i/12) 将在 0 - 83 迭代中正确找到第二个索引。

顺便说一句:countMultiArray 可以替换为 7 * 12，不需要该函数，因为您已经知道这些值。