css html 中的颜色条件基于数据库

Question

我这里用的是bootstrap。我想用红色标记那些 Activity 包含 "N" 的行。在我的数据库中 Activity 字段有两个字符。他们是 Y & N。我这里也用了 jquery 数据 table.What 可以吗？

<?php
  while($reg_data = mysqli_fetch_array($result_sql2))
         {
         ?>
        <tr class="success">                 
            <td > <?php echo $reg_data['ID'] ?> </td>
            <td> <?php echo $reg_data['Name'] ?> </td>
            <td> <?php echo $reg_data['Email'] ?> </td>
            <td> <?php echo $reg_data['Type'] ?> </td>
            <td> <?php echo $reg_data['Dept'] ?> </td>
            <td> <?php echo $reg_data['Activity'] ?> </td> // based on this field //////

         </tr>

Answer 1

一种最好的快速简便的方法是提供内联样式：

<td style="background-color: <?php echo ($reg_data['Activity'] == "Y") ? "green": "red" ?>;">
  <?php echo $reg_data['Activity'] ?>
</td>

您可能想要添加 !important 以防万一需要覆盖：

<td style="background-color: <?php echo ($reg_data['Activity'] == "Y") ? "green": "red" ?> !important;">

Note: I know inline styles are bad.

更新： 抱歉，我错过了您需要在该行进行的操作。您可以在 <tr> 而不是 <td> 上应用相同的东西。所以你的代码将是：

<tr class="success" style="background-color: <?php echo ($reg_data['Activity'] == "Y") ? "green": "red" ?>;">                 
    <td > <?php echo $reg_data['ID'] ?> </td>
    <td> <?php echo $reg_data['Name'] ?> </td>
    <td> <?php echo $reg_data['Email'] ?> </td>
    <td> <?php echo $reg_data['Type'] ?> </td>
    <td> <?php echo $reg_data['Dept'] ?> </td>
    <td> <?php echo $reg_data['Activity'] ?> </td>
 </tr>

感谢 Darren Sweeney 指出。

Answer 2

检查 window.onload。

参考：https://developer.mozilla.org/en/docs/Web/API/GlobalEventHandlers/onload

根据 activity 在所需 <td> 上设置 class 然后在 window.onload 使用 jQuery .parent() 函数并添加 css 到 <td> 的父级，其中包含 "Y" 作为 class。

window.onload = function() {
  $('.YClassName').parent().css('background', 'YOURCOLOR');
};

Answer 3

另一种方法是创建 CSS class 并在满足您的条件时将其添加到元素中。

.red {
 background-color: red;
}

.green {
 background-color: green;
}

然后

<tr class="success <?php echo ($reg_data['Activity'] == "Y") ? "green": "red" ?>">

//table data

</tr>

作为旁注，最好使用“1”和“0”而不是"Y"和"N"。整数 table 行类型往往表现更好？至少，到现在为止我是这么认为的。

css html 中的颜色条件基于数据库

css color condition in html based on database

html

css

angular-ui-bootstrap