Jquery 根据html表的子内容为其每一行着色

您是如何打印从PG数据库获取这些信息的html页面的：

A。包含多行的表，其中每行都有一个或多个子行

B。这些子项是使用非pk ID从SQL中提取的，其中1-parentID n-childID

C。并使用子行的颜色为父行着色，其中： 如果有2个子项，则它们都有“ACK=1”->父项为1（绿色）。 如果有两个子项，一个为ACK=1，另一个为ACK=-1，则父项为-1（红色）

在HTML/PHP/javaApplet/Javascript/Jquery->中，我对所使用的语言不感兴趣，如果有一天这能奏效，那将是令人惊讶的

Excel图像是为了显示我希望这个表的外观，我已经尝试了一个多星期，结果非常糟糕

RowN hidden由引导的可折叠面板（或类似面板）使用

编辑（2）：

我的表格的html代码是：

<table>
<thead>
<th>Expand</th>
<th>Date</th>
<th>Identification</th>
<th>Expedition</th>
<th>Direction</th>
<th>MDN</th>
<th>ACK</th>
</thead>

<tbody>
<tr class=parentrow>
<td>+</td>
<td>27.09.2016</td>
<td>prost</td>
<td>qwa</td>
<td>sent</td>
<td>1</td>
<td>0</td>
</tr>
<tr class=childrow>
<td colspan=9><table><tr>
<td>prost 12 12 1 -1</td></tr>
</table></td></tr>

<tr class=parentrow>
<td>+</td>
<td>24.09.2016</td>
<td>wenon</td>
<td>pra</td>
<td>sent</td>
<td>0</td>
<td>0</td>
</tr>
<tr class=childrow>
<td colspan=9><table><tr>
<td>wenon 32 sent 1 1</td></tr>
<tr><td>wenon 35 sent 1 1</td></tr>
</table></td></tr>
</tbody></table>

扩大
日期
识别
远征
方向
MDN
阿克
+
27.09.2016
普罗斯特
qwa
发送
1.
0
prost 12 1-1
+
24.09.2016
维农
普拉
发送
0
0
wenon 32发送了1 1
wenon 35发送了1 1

父项的ACK和MDN不是子项的ACK和MDN。

第一次查询将从表1中选择（日期、标识、远征、方向、mdn、确认）。
第二次查询将从表2中选择（标识、远征方向、mdn、ack），其中表1的id与表2的id类似

在本例中，html仅显示第1行和第2行。
该按钮将打开一个隐藏的

，结果为SQL2（colspan=9以匹配其父级的长度）

当子对象的ACK为1或-1时，父对象必须继承颜色，而不是值，因为如果它们的ACK相同，这只是一种情况

如果其中一个子项的ACK为负，则父项应突出显示为错误（红色），以将注意力集中在该子项上，我将使用+按钮打开该子项

在不久的将来，孩子们将拥有更多的价值观，可能没有mdn，但ACK将始终存在

---

我假设您的表中有此html代码

<table id="tableId">
   <thead>
      <tr>
        <th>Expand</th>
        ....
         <th>ACK</th>
        ...
      <tr>
   </thead>
   <tbody>
      <tr>      
          <td>4</td>
             ...
          <td class="ACK">0</td>
              ...
      </tr>
      ....
   </tbody>
</table>

这是一张工作票

如果要比较ACK和MDN列（如果它们相同，则为绿色，如果不相同，则为红色），则可以执行以下操作：

$(document).ready(function(){
    $('.ACK').each(function(index){
         var me = $(this);
         if(me.text() !== me.prev('td').text()){
            me.closest('tr').css('background-color','red');
         }
         else if(me.text()==me.prev('td').text()){
            me.closest('tr').css('background-color','green');
         }
    });
});

这是一张工作票

---

希望这将对您有所帮助

我假设您的表中有此html代码

<table id="tableId">
   <thead>
      <tr>
        <th>Expand</th>
        ....
         <th>ACK</th>
        ...
      <tr>
   </thead>
   <tbody>
      <tr>      
          <td>4</td>
             ...
          <td class="ACK">0</td>
              ...
      </tr>
      ....
   </tbody>
</table>

这是一张工作票

如果要比较ACK和MDN列（如果它们相同，则为绿色，如果不相同，则为红色），则可以执行以下操作：

$(document).ready(function(){
    $('.ACK').each(function(index){
         var me = $(this);
         if(me.text() !== me.prev('td').text()){
            me.closest('tr').css('background-color','red');
         }
         else if(me.text()==me.prev('td').text()){
            me.closest('tr').css('background-color','green');
         }
    });
});

这是一张工作票

---

希望这能帮助你

添加你桌子上的html代码添加你桌子上的html代码这先生给了我前所未有的帮助！我能够阅读代码，我想我可以很容易地进入我的项目，只有一个问题：每个人都可能有一个或多个其他作为孩子。孩子是需要着色的，父母必须只继承孩子的颜色（这对我来说很棘手，因为通常情况下，孩子继承父母的东西是相反的）。因此，如果父1的子1为ACK 1，则父1为1-绿色。如果父2的子1是ACK-1，父2是红色的，即使子2的父2是ACK 1（绿色）。用html和php代码更新后，它可能不完整，但现在重要的是我尝试给出的“形状”。如果有一个家长和N个孩子，很抱歉删除接受的答案。我一直在努力，你写的东西虽然很详细，但并不能100%满足要求。因为：

ACK 1 ACK 0[…]

我必须同时为ACK和父项添加颜色。我试图修改您的代码，但没有结果，实际上这就是我的问题所在。如果没有jquery，我已经能够更改同一行ACK的颜色。您可以显示您希望作为输出获得的内容的示例吗？当然！我会在一段时间内更新帖子，我想我会用一个更清晰的图片替换当前的图片！谢谢你的时间！这位先生给了我前所未有的帮助！我能够阅读代码，我想我可以很容易地进入我的项目，只有一个问题：每个人都可能有一个或多个其他作为孩子。孩子是需要着色的，父母必须只继承孩子的颜色（这对我来说很棘手，因为通常情况下，孩子继承父母的东西是相反的）。因此，如果父1的子1为ACK 1，则父1为1-绿色。如果父2的子1是ACK-1，父2是红色的，即使子2的父2是ACK 1（绿色）。用html和php代码更新后，它可能不完整，但现在重要的是我尝试给出的“形状”。如果有一个家长和N个孩子，很抱歉删除接受的答案。我一直在努力，你写的东西虽然很详细，但并不能100%满足要求。因为：

ACK 1 ACK 0[…]

我必须同时为ACK和父项添加颜色。我试图修改您的代码，但没有结果，实际上这就是我的问题所在。如果没有jquery，我已经能够更改同一行ACK的颜色。您可以显示您希望作为输出获得的内容的示例吗？当然！我会在一段时间内更新帖子，我想我会用一个更清晰的图片替换当前的图片！谢谢你的时间！