如何在使用 Jquery 动态生成的表的每三行附加 html 标记答案

【问题标题】：How to append html tags every three rows of a table that is being dynamically generated using Jquery如何在使用 Jquery 动态生成的表的每三行附加 html 标记
【发布时间】：2011-09-26 20:34:35
【问题描述】：

有没有一种方法可以使用 Jquery 在每三个动态生成的表格单元格之后插入“”标签，以便最终得到一个动态的三列表格？

请原谅我缺乏知识，我实际上是在尝试编写我的第一个 jquery 脚本，所以我一无所知。我知道 php，并且我有一个表，其中有一个循环，它动态地创建 <td></td>，其中包含每个标签内的信息。换句话说，它是在静态<tr></tr> 标记内动态创建表格单元格。问题是它不断输出表格而没有将它们分成几行，这给我留下了一堆列。我已经阅读了其他文章，但似乎没有一个与我有完全相同的问题，而且我仍在努力理解如何编写自定义 Jquery 代码。

php 代码很长，充满了许多 if 语句和其他函数，所以我不打算在这里发布它，只是为了让它更简单一点，我制作了我正在尝试做的微型模型.

            <table id="mytable" width="266" border="1" cellspacing="10" cellpadding="10">
              <tr>
            <?php
            $x=0;
            while (have_products($x)) {
                echo '<td>' . somelongassfunction() . '</td>';
                $x++;
            if (fmod($x,3) == 0) {
                echo '</tr><tr>';
                continue;
                }
            if ($x==20){
                echo '</tr>';
                }   
            }
            function somelongassfunction(){
                return 'Hello';
                }
            function have_products($a){
                return $a<=20;
                }   
            ?>

            </table>

此代码循环并动态添加表格单元格，直至达到我给它的限制，这将代表我的数据库项目。每三行，它会添加一个<tr></tr> 或仅添加一个</tr>，具体取决于循环是否继续。这将创建一个 3 列的表。我无法将此代码应用于我的脚本，因为它是一个非常长且复杂的脚本，其中包含大量 if 语句和函数。如果不破坏代码或不得不从头开始重写所有内容，就没有办法做到这一点。

无论如何我可以使用 Jquery 动态附加 tr 标签，我将如何将其应用到？

【问题讨论】：

我认为 jQuery 解决方案将是一个非常混乱的问题，如果你得到列但想要行，你真的应该尝试修复 php。

标签： php jquery dynamic append loops

【解决方案1】：

您可以使用选择器每隔三行选择一次：

$('#table_id > tr:nth-child(3n)').whatever_function()

但是，如果您尝试附加结束 /tr 标记，请尝试在 PHP 中使用可自行重置的计数器来执行此操作（此代码应该可以帮助您入门）：

echo "<tr>";
$x = 0;
$y = 0;
while (have_products($x)) {
    echo '<td>' . somelongassfunction() . '</td>';
    $y++;
    if ($y == 3) {
        $y = 0;
        echo "</tr><tr>";
    }
    $x++;
}
echo "</tr>";

【讨论】：

这真的很棒，但就像我说的那样，我不能在这上面使用任何 php，因为我正在使用的循环脚本太复杂了。我必须把它拆开，重新开始。我在这个问题上放置的脚本纯粹是为了展示我正在尝试做的事情。无论如何，Jquery 似乎是更好的选择，因为它可能允许我插入标签而无需更改已经运行的脚本。谢谢，但即使我不能使用它，我也喜欢柜台的想法。对其他脚本很有用。

【解决方案2】：

jQuery 方法是遍历所有选项卡，并将它们添加到新创建的标签中，这些标签本身会添加到表格的 html 中。大致：

var thisCount=0;
var currenttag="<tr />";
var table=$("table");
$("td").each(function () 
{
    if(thiscount==2)
        {
             table.appendChild(currenttag);
             thisCount=0;
             currenttag="<tr />";
        }
     currenttag.appendChild(this);
}

（这只是提供一个想法，而不是作为正式的 JQ 答案。如果有人想对其进行编辑以使其完全正常工作，请随意）。

【讨论】：