1. 首页
  2. 问题列表
  3. html、css、背景颜色在foreach循环中的单元格值基础上变为红色
提问者：小点点

html、css、背景颜色在foreach循环中的单元格值基础上变为红色


>

  • 这是我的HTML/CSS代码，在表中，如果在foreach循环中将有任何单元格值=Not Approved，那么我希望将该行背景设置为红色。 

    <div>
                      <div style="background-color:purple;height:4px;"> </div>
                          <h1 style="color:red;font-size:28px;"><?= h1 ?></h1>
                                 <div style="margin-bottom:25px;"></div>
                                 <table class="table table-striped">
                                     <thead>
                                     <tr style="color:blue;font-size:16px;">
                                         <th><?= location ?></th>
                                         <th><?= load_cases ?></th>
                                         <th><?= utilization ?></th>
                                         <th><?= remarks ?></th>
                                     </tr>
                                     </thead>
                                     <tbody>
                                      <? table_values.forEach(r =>{?>
                                      <tr>
                                             <td><?= r[0] ?></td>
                                             <td><?= r[1] ?></td>
                                             <td><?= r[2] ?></td>
                                             <td><?= r[] ?></td>


                                         </tr>
                                         <?})?>
                              </tbody>
                              </table>
                  </div>

    • 共1个答案

    匿名用户

    null

    $('table tr').filter(function() {
return $(this).find("td:contains('Not Approved')").length > 0;
}).css('background','red');
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<tr>
<td>Approved</td>
<td>Approved</td>
<td>Approved</td>
</tr>
<tr>
<td>Approved</td>
<td>Not Approved</td>
<td>Approved</td>
</tr>
<tr>
<td>Approved</td>
<td>Approved</td>
<td>Approved</td>
</tr>
</table>

    相关问题