Question

我设置了一个表，它从Mysql数据库中获取信息并显示它很好地退出。不过我想要表格＃34; row＆＃34;根据帐户的老化来改变颜色？有什么简单的方法可以实现这个目标吗？

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>

Answer 2

我可能会在老化的单元格中添加一个类，然后迭代它们并检查jQuery函数中的值，以根据数字所在的范围应用样式。

$("#some-table .aging").each(function() {
  var age = $(this).html();
  if (age <= 2) {
    $(this).parent().css({"background-color" : "blue"});
  } else if (age <= 5) {
    $(this).parent().css({"background-color" : "yellow"});
  } else if (age <= 8) {
    $(this).parent().css({"background-color" : "red"});
  }
});

像这样：http://codepen.io/jonathanrbowman/pen/epVBox

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

2 个答案: