javascript - 基于特定变量的 Bootstrap 上下文表

Question

我设置了一个表，从 Mysql 数据库中获取信息并很好地显示它。但是我希望表格“行”根据帐户的老化时间改变颜色？有什么简单易行的方法可以实现这一点？

Home.php

<div class="row">
                <div class="col-md-12">
                    <table class="table table-bordered table-striped table-responsive">
                        <tr class="header">
                            <td>Rep</td>
                            <td>Date</td>
                            <td>Name</td>
                            <td>P_O</td>
                            <td>Due Date</td>
                            <td>Terms</td>
                            <td>Aging</td>
                            <td>Open Balance</td>
                        </tr>
                        <?php 
                            while($row = mysql_fetch_array($query)) {

                                $className ="";
                                if ($row['Aging'] >= 45)
                                {
                                    $className="clsRedRow";
                                }
                                else if($row['Aging'] >= 25 && $row['Aging'] <= 44)
                                {
                                    $className="clsYellowRow";
                                }

                                echo "<tr class='$className'>";
                                echo "<td>".$row[Rep]."</td>";
                                echo "<td>".$row[Date]."</td>";
                                echo "<td>".$row[Name]."</td>";
                                echo "<td>".$row[P_O]."</td>";
                                echo "<td>".$row[Due_Date]."</td>";
                                echo "<td>".$row[Terms]."</td>";
                                echo "<td>".$row[Aging]."</td>";
                                echo "<td>".$row[Open_Balance]."</td>";
                            }
                        ?>
                    </table>
                </div>
            </div>

Answer 1

尝试向 <tr> 添加一个内联类元素。像这样:

<?php
while ($row = mysql_fetch_array($query)) 
{
    $className = "";
    if ($row['Aging'] < 50) 
    {
        $className = "clsRedRow";
    } 
    else
    {
        $className = "clsGreenRow";
    }
    echo "<tr class='$className'>";
    echo "<td>" . $row[Rep] . "</td>";
    echo "<td>" . $row[Date] . "</td>";
    echo "<td>" . $row[Name] . "</td>";
    echo "<td>" . $row[P_O] . "</td>";
    echo "<td>" . $row[Due_Date] . "</td>";
    echo "<td>" . $row[Terms] . "</td>";
    echo "<td>" . $row[Aging] . "</td>";
    echo "<td>" . $row[Open_Balance] . "</td>";
}
?>

然后，您需要在 HTML 文档中设置正确的样式(在 PHP 脚本之上，不确定其余样式设置的位置):

<style>
  .clsRedRow{ background-color: red; }
  .clsGreenRow{ background-color: green; }
</style>