Question

我在php和mysqli中相当新，并试图建立一些基本的网站。

基本上，我想在php中做出循环语句以在同一行中创建具有相同大小和颜色的卡片，而无需自己在html中手动创建卡片。

使用引导程序，php和mysqli

我使用的数据库包含itemname（varchar），itemprice（varchar）和itemimage（mediumblob）

代码已成功运行，但输出与引导卡不匹配，并且它们拒绝位于同一行

有人可以帮助我吗？谢谢

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div class="container">
<?php

require 'dbh.inc.php';

$sql = "SELECT * FROM item";
$stmt = mysqli_stmt_init($conn);

	if (!mysqli_stmt_prepare($stmt,$sql)) {
		echo "error";
	}	else{
		mysqli_stmt_execute($stmt);
		$result = $stmt->get_result();
			if ($result->num_rows > 0) {
				print '<div class="row">';
				while ($row = $result->fetch_assoc()) {
						print'	<div class="col-4">';
						print'				<div class="card">';
						print'					<img height="250" width="250" class="card-img-top" src="data:image/jpeg;base64,'.base64_encode( $row['itemimage'] ).'">';
						print'						<div class="card-body">';
						print'							<h5 class="card-title">'.$row["itemname"].'</h5>';
						print'							<p class="card-text">Price : '.$row["itemprice"].'</p>';
						print'						</div>';
						print'				</div>';
						print'			</div>';
				}	
			}	else {
				print' </div>';
				}
		}
$conn->close();
?>

	<script src="bootstrap/js/jquery-3.3.1.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
	<script src="bootstrap/js/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
	<script src="bootstrap/js/bootstrap.min.js" integrity="sha384-7aThvCh9TypR7fIc2HV4O/nFMVCBwyIUKL8XCtKE+8xgCgl/PQGuFsvShjr74PBp" crossorigin="anonymous"></script>
</div>
</body>
</html>

The Result

Answer 1

我假设您已经测试过查询结果中确实有数据。

稍微复制并更新了您的代码。几件事：

您在else语句的if()中关闭了div（用于行），但是在if()端将其打开。
您可以关闭PHP并在函数/循环中使用纯HTML，只要您正确使用<?php或<?=和?>

<?php function createCard(array $row) { ?>
    <div class="col-4">
        <div class="card">
            <img height="250"
                 width="250"
                 class="card-img-top"
                 src="data:image/jpeg;base64,<?= base64_encode($row['itemimage']) ?>">
            <div class="card-body">
                <h5 class="card-title"><?= $row["itemname"] ?></h5>
                <p class="card-text">Price : <?= $row["itemprice"] ?></p>
            </div>
        </div>
    </div>
<?php } ?>

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
    <div class="container">
        <div class="row">
        <?php

        require 'dbh.inc.php';

        $sql  = "SELECT * FROM item";
        $stmt = mysqli_stmt_init($conn);

        if (!mysqli_stmt_prepare($stmt, $sql)) {
            echo "error";
        } else {
            mysqli_stmt_execute($stmt);
            $result = $stmt->get_result();
            if ($result->num_rows > 0) {
                while ($row = $result->fetch_assoc()) {
                    createCard($row);
                }
            }
        }
        $conn->close();
        ?>
        </div>

        <script src="bootstrap/js/jquery-3.3.1.min.js"
                integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
                crossorigin="anonymous"></script>
        <script src="bootstrap/js/popper.min.js"
                integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
                crossorigin="anonymous"></script>
        <script src="bootstrap/js/bootstrap.min.js"
                integrity="sha384-7aThvCh9TypR7fIc2HV4O/nFMVCBwyIUKL8XCtKE+8xgCgl/PQGuFsvShjr74PBp"
                crossorigin="anonymous"></script>
    </div>
</body>
</html>

尝试在php中创建循环引导卡

1 个答案: