新增CSS類的MySQL結果基於指標分析

Question

我填充日期列表從MySQL數據庫是這樣的：

<?php 
    while ($row = mysql_fetch_array($list_customers)) { 
     echo "<tr>\n"; 
      echo "<td>".$row['customer_date']."</td>\n"; 
     echo "</tr>\n"; 
    } 
?> 

現在我想補充一個<span>根據某些條件改變class=''內的結果：

• 如果日期的結果是不到30天，從今天的日期到達，加 class='yellow'
• 如果日期的結果是從今天起，廣告超過30天d class='green'
• 如果結果日期已過，基於今天的日期，添加class='red'

這將是可能的嗎？提前致謝。

Answer 1

是的。只是當前時間使用一系列的if報表您指定的日期和變量定義的類名，如：

while ($row = mysql_fetch_query($list_customers)) { 
    echo "<tr>\n"; 
    $class = "class='green'"; 
    if (strtotime($row['customer_date']) < time()) { 
     $class = "class='red'"; 
    }elseif (strtotime($row['customer_date']) < time() + 30*24*3600) { 
     $class = "class='yellow'"; 
    } 
    echo "<td><span $class>" . $row['customer_date'] . "</span></td>\n"; 
    echo "</tr>\n"; 
}   

Answer 2

這真是你寫指定的if()條件，只是一個簡單的例子。沒有魔法。首先，我們需要知道customer_date字段的格式。由於您直接將其打印到HTML代碼中，我猜它是以文本格式，所以我們需要做的第一件事是將其轉換爲日期對象。

$custDate = new DateTime($row['customer_date']); 

該日期是否是一個合適的格式只會工作，但說實話，如果它不是在標準的MySQL日期格式，那麼你應該現在就停止和修復，我們再往前走了。

您還需要當前日期作爲日期對象：

$currDate = new DateTime(); 

現在你可以很輕鬆地使用上DateTime類的方法對它們進行比較：

$dateDiff = $currDate->diff($custDate)->days; 

現在你明白了，你可以做你的if()條件。

1. 您使用mysql_fetch_array()：

   不過，我想指出的幾件事情。請注意，mysql_功能已過時;如有可能，您應該用mysqli_xxx或PDO庫進行更換。

2. 你建議在<td>裏面放入<span>這個類 - 可以直接把類放入<td>。這將是一個更清潔的選擇，所以我會在答案中使用它，儘管這取決於你。

3. 您建議使用類名稱red,​​,yellow。請注意，這不是特別好用的類名。類名應該反映元素的實際用途，而不是它的外觀。這是因爲使用類和將樣式從HTML中分離出來的重點在於可以在不更改HTML的情況下更改樣式。但是，如果類名稱只是顏色名稱，它會將其與邏輯上的顏色聯繫起來;您也可以將顏色直接放入HTML中。更好的類名選擇可能類似custExpired,custNearlyExpired等。這會給你以後更多的靈活性，並使得閱讀它的代碼更容易理解（例如google bot！）。

因此，所有考慮到這一點，這裏的一些代碼對你：

$currDate = new DateTime(); 
while ($row = $mysqli->fetch_array($list_customers)) { 
    $custDate = new DateTime($row['customer_date']); 
    $dateDiff = $currDate->diff($custDate)->days; 

    $class = ''; 
    if($dateDiff < 30) { $class = 'custNearlyExpired'; } 
    if($dateDiff < 0) { $class = 'custExpired'; } 

    echo "<td class='custDate {$class}>{$row['customer_date']}</td>\n"; 
} 

和CSS：

td.custDate { 
    background: green; 
} 
td.custDate.custNearlyExpired { 
    background: yellow; 
} 

td.custDate.custExpired { 
    background: red; 
} 

希望有所幫助。