Question

我有一个指定宽度为980px的容器，它包含内联块元素。每个元素的宽度和高度均为140px，这意味着每个元素/行在下推到下一行/行之前可以包含7个元素。

<div id="container"><div id="ele1"></div><div id="ele2"></div><div id="ele3"></div><div id="ele4"></div><div id="ele5"></div><div id="ele6"></div><div id="ele7"></div><div id="ele8"></div><div id="ele9"></div><div id="ele10"></div><div id="ele11"></div><div id="ele12"></div><div id="ele13"></div><div id="ele14"></div></div>

知道元素的数量，我如何用JavaScript（而不是jQuery）确定该元素所在的行/行和列？我需要能够为任意数量的元素执行此操作，因为数字是动态的，不是由脚本设置的。

Answer 1

这可能有效：

column = Number(yourNumber) % 7
row = Math.floor(Number(yourNumber) / 7)

这假设您从0开始，然后第一个元素是（0,0）

Answer 2

如果您知道从0,1，...开始的元素编号，请使用以下代码：

function getRowColNoFor(elementNo) {
    var col = elementNo % 7;

    return {
        col: col,
        row: (elementNo - col) / 7
    };
}

Answer 3

如果你知道你将有7个元素，你可以将元素的数字（从0开始）除以7得到它的位置。

如果将元素的数字除以7，则“整数”值为其行，余数为其列。

因此，要获得网格中的位置，您可以这样做：

function getPositon(index) {
    return {
        row: Math.floor(index / 7),
        column: index % 7
    };
}

DEMO：http://jsfiddle.net/UVZ5f/1/

根据元素计算计算行号

3 个答案: