每隔3个td后创建一个新的tr

时间:2011-12-11 15:53:02

标签: jquery loops

动态创建一个只能包含3个TD的TR。所以,如果我有6个元素,那么将生成两个TR。我在这里写了一些松散的代码。请纠正。

提前致谢。

while(j<=6) {

        $('#table tbody').append('<tr><tr>');
            for(var k=0; k<3; k++) {
                var divData = '<td><article><div><span onmouseover="navigateDressMe(this,$(this).parent());" onclick="navigateFromTRA($(this).parent().find("a"));" style="cursor: pointer;"><img style="width:200px;border-width:0px;" src="/resources/images/'+StrVideoJsonOBj.tableVideo[k].SmallImageURL+'" title="'+StrVideoJsonOBj.tableVideo[k].Title+'"></span><p><a title="El congelador, tu mejor aliado en la cocina" href="">'+StrVideoJsonOBj.tableVideo[k].Title+'</a><span>&nbsp;</span>Aprovecha el congelador para ahorrar tiempo en la cocina y conservar bien tus alimentos</p><a href=""></a></div></article></td>';

                $('#table tbody tr').append(divData);
                j = j+3;

            }




        }

3 个答案:

答案 0 :(得分:1)

%运算符是正确的选择,您只需要重新考虑那里的逻辑。

每三行是k%3为0时,也就是当你想要打印一个新的tr时。 每隔一个k你就会想要添加一个td。

答案 1 :(得分:0)

您只想将其附加到最后插入的TR,所以请执行以下操作:

$('#table tbody tr:last').append(divData);

答案 2 :(得分:0)

您可以通过对行使用一个循环并为列使用嵌套的循环来创建表的结构:

$(function () {
     var $table = $('#table tbody');
     var maxRow = 2;
     var maxCol = 3;
     for (var row = 0; row < maxRow; row++) {
        $table.append('<tr></tr>');
        $row = $('#table tr:last');
        for (var col = 0; col < maxCol; col++) {
            $row.append('<td>row '  + row + ' column ' + col +'</td>');
        }
    }
});