1

私は動的に値でいっぱいのテーブルを作成しています...このテーブルの行の色を白と明るい灰色の間で交互にする方法があるかどうか、私はうんざりしていました..

これは、テーブルを作成するために使用しているコードです...

while($row = mysql_fetch_array($result))
  {
  echo "<tr>";
  echo "<td>" . $row['name'] . "</td>";
  echo "<td>" . $row['width'] . "</td>";
  echo "<td>" . $row['height'] . "</td>";
  echo "<td>" . $row['normal_fill'] . "</td>";
  echo "<td>" . $row['our_fill'] . "</td>";
  echo "<td>" . $row['old_price'] . "</td>";
  echo "<td>" . $row['price'] . "</td>";
  echo '<td><form method="post" action=""><input type="hidden" name="duckdown_id" value="'.$row['duckdown_id'].'" /><input type="submit" name="sumbit" value="Delete" /></form></td>';
  echo "</tr>";
  }
echo "</table>";
4

4 に答える 4

4

増分変数を追加し、2 行ごとにチェックします。

$i = 1;
while($row = mysql_fetch_array($result)){
  $background = '#000';
  if($i%2 == 0){
      $background = '#00f';
  }
  $i++;
  echo "<tr style='background-color:".$background.";'>";

補足として、まだ関数を使用しているようです。関数が非推奨になったため、mysql_*開始したばかりの場合は移動できます。ここに素晴らしいチュートリアルがあります。PDOmysql_*

于 2012-10-03T06:44:49.373 に答える
3

私のアプローチは、@Mihai Iorga のものと非常によく似ています (そしてそれに基づいています) は、css クラスベースになります。

CSS:

gray { background-color: gray; }
red { background-color: red; }

PHP:

$i = 1;
while($row = mysql_fetch_array($result)){
  $background = 'gray';
  if($i%2) {
      $background = 'red';
  }
  $i++;
  echo "<tr class='$background'>";
}
于 2012-10-03T06:54:08.110 に答える
0

以下のように単純な jquery コードを使用できます。

   $(document).ready(function()
   {
      $('tbody tr:odd').addClass("row-odd");
      $('tbody tr:even').addClass("row-even");  
   });

そして、スタイル シートで 'row-odd' および 'row-even' クラスを定義します。

于 2012-10-03T07:14:19.040 に答える
0

CSS を使用する場合 (Mihai lorga のコードを使用)

PHP

$i = 1;
while($row = mysql_fetch_array($result)){
    if($i%2 == 0){
        echo "<tr class=even>";
    }else{
        echo "<tr class=odd>";
    }
    echo "<td>" . $row['name'] . "</td>";
    //etc.
    $i++;
}

CSS

<style type="text/css">
    .even{
        background-color:#00f;
    }
    .odd{
        background-color:#000;
    }
</style>
于 2012-10-03T07:01:14.877 に答える