PHP、MySQL 和 JQuery 有问题吗？

Question

我有这个脚本，可以显示我将在下面显示的所有用户图像。

我的问题:有没有办法可以显示 MySQL 数据库中的前 10 个图像，并让脚本隐藏其余的用户图像，直到用户单击链接 <a href="#">View All</a>当用户单击链接时让其余图像向下滑动？

这是我的 PHP 和 MySQL 脚本？

$multiple = FALSE;
$row_count = 0;

$dbc = mysqli_query($mysqli,"SELECT *
                             FROM images
                             WHERE images.user_id = '$user_id'");
if (!$dbc) {
    print mysqli_error($mysqli);
} else {
    while($row = mysqli_fetch_array($dbc)){ 

    if(($row_count % 5) == 0){
        echo '<ul>';
    }
        echo '<li><img src="/images/thumbs/' . $row['url'] . '" /></li>';

if(($row_count % 5) == 4) {
    $multiple = TRUE;
    echo "</ul>";
} else {
    $multiple = FALSE;
}
$row_count++;
}
if($multiple == FALSE) {
    echo "</ul>";
}
}
echo '<a href="#">View All</a>';

Answer 1

将图像分成两部分。并将第二部分设置为隐藏。然后向 SlideDown 添加一个单击处理程序。这是代码:

更新:没有必要将前 10 张图像放入 div，但也不会造成伤害。

PHP

<?php

//echo  '<div id="images">';  // visible images

while($row = mysqli_fetch_array($dbc)) {

  // other stuff
  // ...

  // after the 10th image (0-9)
  // open the hidden div
  if ($i == 9) {
    //echo  '</div>';          // end of visible images
    echo  '<div id="hidden">'; // hidden images
  }
}

echo '</div>'; // end of hidden
echo '<a href="#" id="view_all">view all</a>'; // view all

?>

jQuery

$(document).ready(function(){
    $("#hidden").hide();
    $("#view_all").click(function(){
      $("#hidden").slideDown();
    });
});

See it in action

注意:一定不要用CSS隐藏div。您可以在 jQuery 中执行此操作，这样您就可以允许禁用 JS 的用户获取内容。