Question

我想在每个第五个div之后插入一个<br clear="all" />。下面是我如何在php中创建div，然后我尝试使用jquery来分隔它们。但它不起作用！任何帮助将不胜感激！提前谢谢！

PHP：

$get = mysql_query("SELECT * FROM Products $cate ") or die(mysql_error());
    while($row= mysql_fetch_array($get)){
        $pname = $row['Pname'];
        $image = $row['Pimage'];
        $id = $row['ID'];
        ?>
    <div class="productCat"><a href="product.php?id=<?php echo $id ?>"><img src="../products/<?php echo $image ?>" width="100" height="100" /><br /><?php echo $pname ?></a></div>

        <?php
        }
    ?>

JQUERY：

$(".productCat :nth-child(5)").append("<br clear='all'/>");

Answer 1

在类选择器和nth-child之间放置空格：

$(".productCat:nth-child(5)").append("");

Answer 2

问题在于，由于额外的空间，它正在寻找.productCat的第五个子的多个。编辑：实际上，它只是寻找.productCat的第5个孩子，因为你离开了n。

此外，出了什么问题：

/* CSS: */
.productCat:nth-child(5n+1) {clear: left;}

这种仅限CSS的解决方案效率更高。

Answer 3

为什么不用PHP做呢？如果你使用jQuery，没有javascript的人就不会有你的“br”......

<?php
$get = mysql_query('SELECT * FROM Products '.$cate) or die(mysql_error());
$i=0;
while($row = mysql_fetch_array($get)){
    $i++:
    ?>
    <div class="productCat"><a href="product.php?id=<?php echo $row['ID']; ?>"><img src="../products/<?php echo $row['Pimage']; ?>" width="100" height="100" /><br /><?php echo $row['Pname']; ?></a></div>
    <?php
    if($i == 5){
        echo '<br clear="all" />';
        $i=0;
    }
}
?>

Answer 4

.productCat之后不应该有空格。

另外，为什么不在PHP中执行此操作？只需添加一个计数器：

$count=0;
while($row= mysql_fetch_array($get)){
    $count++;
    $pname = $row['Pname'];
    $image = $row['Pimage'];
    $id = $row['ID'];
    ?>
<div class="productCat"><a href="product.php?id=<?php echo $id ?>"><img src="../products/<?php echo $image ?>" width="100" height="100" /><br /><?php echo $pname ?></a></div>

    <?php
    if($count%5==0)
         echo "<br clear='all'/>";
    }
?>

：第n个孩子不在jquery工作

4 个答案: