php - 确定元素在可变长度网格中的位置

Question

我有一个包含可变数量元素的网格。假设每行 5 个图像和可变数量的图像。我需要确定每个图像位于哪一列(因为没有更好的词)...即 1、2、3、4 或 5。

在此网格中，图像 1、6、12 和 17 将位于第 1 列，而图像 4、9 和 15 将位于第 4 列。

1  2  3  4  5 
6  7  8  9  10
12 13 14 15 16
17 18 19

我想做的是根据每个元素的列位置将背景图像应用到每个元素。

这个硬编码和不灵活但工作完美的例子(如果我在这里咆哮错误的树，无论如何请告诉我你理想地如何完成这个，因为当我看到有人问“如何”时，它总是让我烦恼我应该 build 一个镀金的太阳能喷气背包来到达这座建筑物的顶部吗？”而他们真的应该问“电梯在哪里？”):

switch (imgnum){
                case "1" : case "6" : case "11" :
                    value = "1";
                    break;
                case "2" : case "7" : case "12" :
                    value = "2";
                    break;
                case "3" : case "8" : case "13" :
                    value = "3";
                    break;
                case "4" : case "9" : case "14" :
                    value = "4";
                    break;
                case "5" : case "10" : case "15" :
                    value = "5";
                    break;
                default :
                    value = "";
            }

            $('.someclass > ul').css('background','url("/img/'+value+'.png") no-repeat');

哦，更多信息...该开关中 imgnum 的值由点击事件确定。

Answer 1

对于此类工作，请使用模运算符。模运算符给出整数除法的余数。 PHP 和 JS 中的模运算符都是 %: http://php.net/manual/en/language.operators.arithmetic.php http://www.java2s.com/Tutorial/JavaScript/0040__Operators/Modulus.htm

您可以将整个代码块替换为:

value = imgnum % 5;
if(value == 0) { value = 5; }
$('.someclass > ul').css('background','url("/img/'+value+'.png") no-repeat');