Javascript 如何在php中使用while循环在div中换行?
我想在div之后加上br标签或hr标签,我的div在while循环中。请检查下面的代码我做错了什么Javascript 如何在php中使用while循环在div中换行?,javascript,php,jquery,html,css,Javascript,Php,Jquery,Html,Css,我想在div之后加上br标签或hr标签,我的div在while循环中。请检查下面的代码我做错了什么 <?php $count =0;?> <?php while($product = mysqli_fetch_assoc($featured)) : ?> <?php $count++; if($count%4 == 0) { ?><br><hr><?php } ?> <!-- Number 1 --> &
<?php $count =0;?>
<?php while($product = mysqli_fetch_assoc($featured)) : ?>
<?php $count++;
if($count%4 == 0) {
?><br><hr><?php
}
?>
<!-- Number 1 -->
<div class="col-md-3">
<h6><?= $product['title']; ?></h6>
<div class="container-fluid">
<div class="row" style="width:200px;height:200px">
<img src="<?= $product['image']; ?>" alt="<?= $product['title']; ?>" class="img-thumb" />
</div>
</div>
<hr>
<p class="list-price text-danger">List Price: <s>$<?= $product['list_price']; ?></s></p>
<p class="price">Our Price: $<?= $product['price']; ?></p>
<button type="button" class="btn btn-sm btn-success" onclick = "detailsmodal(<?= $product['id']; ?>)">Deatils</button>
</div>
“alt=”“class=”img thumb“/>
标价:$
我们的价格:$
将条件放在product div之后,并将您的$count
放在条件之后,如下所示:
<?php
$count = 1;
while($count <= 20) {
echo "Product ID: $count <br>";
if($count%4 == 0) echo "<hr>";
$count++;
}
您的PHP标记有太多不必要的打开和关闭。请看一个使用MySQL查询所有结果的示例:
// Create a counter to store where we're at
$counter = 1;
// Iterate through each product
foreach($products as $product) {
// Print the HTML markup
echo '
<div class="col-md-3">
<h6>', $product['title'], '</h6>
<div class="container-fluid">
<div class="row" style="width: 200px; height: 200px;">
<img src="', $product['image'], '" alt="', $product['title'], '" class="img-thumb" />
</div>
</div>
<hr />
<p class="list-price text-danger">List Price: <s>', $product['list_price'], '</s></p>
<p class="price">Our Price: $', $product['price'], '</p>
<button type="button" class="btn btn-sm btn-success" onclick = "detailsmodal(', $product['id'], ')">Deatils</button>
</div>';
// Print the line/horizontal rulers
if($counter % 4 === 0) {
echo '<br /><hr />';
}
// Increment the counter
$counter++;
}
//创建一个计数器来存储我们所在的位置
$counter=1;
//迭代每个产品
foreach($products as$product){
//打印HTML标记
回声'
“,$product['title'],”
标价:,$product['list_price'],'
我们的价格:$,$产品['price'],'
死亡
';
//打印直线/水平标尺
如果($counter%4==0){
回声“
”;
}
//递增计数器
$counter++;
}
小提琴:
更新
阅读您的评论后,您需要使用类来布局产品库。请看一看不需要保留计数器的示例:
<?php
// Print the containing card-columns
echo '<!-- beginning of card gallery -->
<div class="card-columns mt-3">';
// Iterate through each product
foreach($products as $product) {
// Print the HTML markup
echo '
<div class="card">
<img src="', $product['image'], '" alt="', $product['title'], '" class="card-img-top" />
<div class="card-body">
<h5 class="card-title">', $product['title'], '</h5>
<p class="card-text text-danger">List Price: <s>', $product['list_price'], '</s></p>
<p class="card-text">Our Price: <s>', $product['price'], '</s></p>
<button type="button" class="btn btn-sm btn-success", onclick="detailsmodal(', $product['id'], ')">Deatils</button>
</div>
</div> <!-- end of single product -->';
}
echo '
</div> <!-- end of product gallery -->';
?>
在模数求值后将$计数器的增量移动到。@Sarah-你运行小提琴了吗?它的工作原理与你期望的完全一样。此外,如果你使用引导,为什么不创建一个新行而不是换行呢?是的,我使用的是引导4。实际上,我不认为为此目的需要代码,因为我想在创建行时使用代码穿过第8列,然后换行。因此,我尝试在“最后一个细节”按钮上填充和边距,但对我来说也不起作用。为我创建一个新行可能会起作用。但在while循环中,如何在4个产品之后创建新行。这里的问题仍然是我开始的地方。@Sarah-那么你需要为你的产品库使用一个卡片列,看看这个fiddle:。我已经更新了我的帖子,介绍了如何使用正确的引导标记来实现这一点。谢谢你的帮助,David!这正是我想要的。但是当我添加HD图像时,所有的东西都被破坏了。我如何修复图像框架,使所有的东西都在队列和盒子中?我可以调整图像大小,但它会缩小。style=”宽度:100%;高度:100px;“,如何在不收缩或拉伸图像的情况下实现图像的固定帧?对不起,我弄错了,请使用$x++;
使用$count++;
<?php
// Print the containing card-columns
echo '<!-- beginning of card gallery -->
<div class="card-columns mt-3">';
// Iterate through each product
foreach($products as $product) {
// Print the HTML markup
echo '
<div class="card">
<img src="', $product['image'], '" alt="', $product['title'], '" class="card-img-top" />
<div class="card-body">
<h5 class="card-title">', $product['title'], '</h5>
<p class="card-text text-danger">List Price: <s>', $product['list_price'], '</s></p>
<p class="card-text">Our Price: <s>', $product['price'], '</s></p>
<button type="button" class="btn btn-sm btn-success", onclick="detailsmodal(', $product['id'], ')">Deatils</button>
</div>
</div> <!-- end of single product -->';
}
echo '
</div> <!-- end of product gallery -->';
?>