如何為數據庫中的每一行數據顯示一個div？

Question

我有一個數據庫，用於存儲項目的信息，包括圖像源路徑，描述等。當前數據是靜態的，如下面的代碼片段所示。 基本上，我需要為表中的每一行數據輸出一個新的“縮略圖”。 我認為這是通過for循環完成的，但是我不確定如何實現這一點。 謝謝。

<div class='panel-heading' contenteditable='false'>Your items for sale</div>
<div class='panel-body'>
    <div class='row'>
        <div class='col-md-4'>
            <div class='thumbnail'>
                <img alt='300x200' src='http://lorempixel.com/600/200/people'>
                <div class='caption'>
                    <h3>
                        Rover
                    </h3>
                    <p>Cocker Spaniel who loves treats.</p>
                    <p></p>
                </div>
            </div>
        </div>
        <div class='col-md-4'>
            <div class='thumbnail'>
                <img alt='300x200' src='http://lorempixel.com/600/200/city'>
                <div class='caption'>
                    <h3>
                        Marmaduke
                    </h3>
                    <p>Is just another friendly dog.</p>
                    <p></p>
                </div>
            </div>
        </div>
        <div class='col-md-4'>
            <div class='thumbnail'>
                <img alt='300x200' src='http://lorempixel.com/600/200/sports'>
                <div class='caption'>
                    <h3>
                        Rocky
                    </h3>
                    <p>Loves catnip and naps. Not fond of children.</p>
                    <p></p>
                </div>
            </div>
        </div>
    </div>
</div>

我的嘗試：

<? $sql = "SELECT srcpath FROM images";
$res = mysql_query($sql) or die(mysql_error());

$result = mysql_query($sql);

echo '<div"><ul>';

while ($fetch = mysql_fetch_array($result)) {
    $petname = $fetch['username'];
    echo '<li><P>'.$fetch['description'].'</P>';
    echo '<img src="'.$fetch['srcpath'].'" alt="" />';
    echo '</li>';
}
echo '</ul></div>';

?>

Answer 1

我仍然不鼓勵使用mysql，因為不建議使用mysql，所以應該使用mysqli或其他方式。

無論如何，我建議您通過php准備整個html循環，然后打印出來，如下所示：

首先，這將是您的php部分：

<?
$sql = "SELECT username, description, srcpath FROM images"; // Note that I included the fields you're actually using.

$res = mysql_query($sql) or die(mysql_error());

$result = mysql_query($sql);

$divHtml ='<div class='panel-body'>'; // Here's where you add the main div that holds the others.

//now in the loop you've got to be careful with the css classes, as your html shows, they won't be always the same. But this should give you some insight on how it works.

while($fetch = mysql_fetch_array($result)){

    $divHtml .='<div class="row">';// add css classes and the like here. In case you don't know, the .= operators concatenate the strings that will make your html code.
    $divHtml .='    <div class="col-md-4">'; // be careful with this class, as you might need to evaluate it for every run of the loop
    $divHtml .='        <div class="thumbnail">';
    $divHtml .='            <li><P>' . $fetch['description'] .'</P>';
    $divHtml .='            <img src="'.$fetch['srcpath'].'" alt="" />';
    $divHtml .='            </li>';
    $divHtml .='        </div>';
    $divHtml .='    </div>';
    $divHtml .='</div>';
}

$divHtml .= '</div>'; // And here you close the main div.
?>

然后，您的html將如下所示：

<div class='panel-heading' contenteditable='false'>Your items for sale</div>
          <?php echo $divHtml; ?>