php - 向画廊添加分页的最佳方法

Question

我有一个客户的网站，他的图库中的图片越来越多。我想知道我是否可以得到一些建议，看看你们认为什么是处理我目前所处情况的最佳方法。

http://www.richsdockcompany.com/Gallery.php

这个画廊是由 php 和 mysql 创建的。我想将限制设置为 12 张图像，然后它会切换到不同的页面，但它无法刷新页面，否则图库将重置。

画廊的当前代码

<?php

include_once "header.php";
include($_SERVER['DOCUMENT_ROOT'] . "/connections/dbconnect.php");
$images = mysql_query("SELECT * FROM images");
while ($image=mysql_fetch_assoc($images))
?>

<div id="Wrap">
<div class="Titles"><h2 style="font-size:36px;">Rich's Dock Company Image Gallery</h2></div><br />
<hr />
<div id="PhotoBoxWrap">

<!--======START GALLERY======-->
    <div class="row">
        <div class="column grid_12">
            <div class="row">
                <div class="column grid_12">
                    <!-- start Filter categories -->
                    <ul id="filter">
                        <li class="active"><a href="#" class="all">All</a></li>
                        <li><a href="#" class="shore">Dock Builders On Shore</a></li>
                        <li><a href="#" class="commercial">Commercial Docks</a></li>
                        <li><a href="#" class="residential">Residential Docks</a></li>
                        <li><a href="#" class="repair">Dock Repairs &amp; Additions</a></li>
                        <li><a href="#" class="barge">Barge Life</a></li>                               
                    </ul>
                    <!-- End Filter categories -->  
                </div>
            </div>  

            <!-- Divider -->
            <div class="row">
                <div class="column grid_12">            
                    <div class="clear"></div>
                    <div class="divider spacer5"></div>     
                </div>
            </div>
            <!-- End divider -->

<div class="row">

<ul id="stage" class="portfolio-4column">




<?php
$images = mysql_query("SELECT * FROM images ORDER BY id DESC");
while ($image=mysql_fetch_array($images))
{
    ?>
    <li data-id="id-<?=$image["id"] ?>" data-type="<?=$image["data_type"] ?>">
    <div class="column grid_3 gallerybox">
    <a class="fancybox" rel="<?=$image["data_type"] ?>" href="images/gallery/<?=$image["file_name"] ?>" title="<?=$image["title"] ?>">
    <img src="images/gallery/<?=$image["file_name"] ?>" alt="<?=$image["title"] ?>" class="max-img-border"></a>
    <h4 style="color:#2B368D; text-align:center;"><?=$image["title"] ?></h4>
    <p style="text-align:center; font-size:15px;"><?=$image["description"] ?></p>
    </div>  
    </li>
    <?php
}
?>

</ul><!--END LIST-->

我唯一能想到的就是创建一个包含所有图像的 slider 或使用带有分页的 ajax，这样就不会有刷新问题。

我从未尝试过分页，所以请放轻松。

如有任何建议，我们将不胜感激。

谢谢!

Answer 1

看看这个示例代码，它以一种简单的方式处理分页。您可以为每个应该分页的列表重用函数 getPagesNavi。它返回 html，其中包含用于浏览页面的链接。

如果你喜欢用ajax加载页面，你需要自己做一些修改。这只是一个向您展示其工作原理的示例。

$page = intval($_GET['page']);
$myurl = 'index.php?action=list';

$db->select("select * from tablename");
$count_total = $db->getRecords();

$items_per_page = 10;
$start = $page * $items_per_page;
$limit = "limit $start, $items_per_page";

$db->select("select * from tablename $limit");

while($row = $db->fetchArray()) {
    // your output here...
}

echo getPageNavi($myurl,$page,$count_total,$items_per_page);


function getPagesNavi($link, $current_page, $count_total, $items_per_page, $number_of_visible_pagelinks_updown = 5, $page_varname = "page") {
    $result = "";
    if ($count_total <= 0) {
        return "";
    }
    $pages_float = $count_total / $items_per_page;
    $number_of_pages = ceil($pages_float) - 1;
    $start = $current_page - $number_of_visible_pagelinks_updown;
    $end = $current_page + $number_of_visible_pagelinks_updown;
    if ($end > $number_of_pages) {
        $dif = -$number_of_pages + $end;
        $end = $number_of_pages;
        $start = $start - $dif;
    }
    if ($start < 0) {
        $dif = -$start;
        $end = $end + $dif;
        $start = 0;
    }
    if ($end > $number_of_pages) {
        $end = $number_of_pages;
    }
    $back = $current_page - 1;
    $forward = $current_page + 1;
    if ($current_page > 0) {
        $result .= "
          <span class=\"pageItem\"><a href=\"$link&$page_varname=0\"><<</a></span>
          <span class=\"pageItem\"><a href=\"$link&$page_varname=$back\"><</a></span>";
    } else {
        $result .= "<span class=\"pageItem\"><<</span>";
        $result .= "<span class=\"pageItem\"><</span>";
    }
    for ($i = floor($start); $i <= floor($end); $i++) {
        $j = $i + 1;
        $class = "";
        if ($i == $current_page) {
            $class = " currentPageItem";
        } 
        $result.= "<span class=\"pageItem$class\"><a href=\"$link&$page_varname=$i\">$j</a></span>";
    }
    if ($current_page != $number_of_pages) {
        $result .= "<span class=\"pageItem\"><a href=\"$link&$page_varname=$forward\">></a></span>";
        $result .= "<span class=\"pageItem\"><a href=\"$link&$page_varname=$number_of_pages\">>></a></span>";
    } else {
        $result .= "<span class=\"pageItem\">></span>";
        $result .= "<span class=\"pageItem\">>></span>";
    }
    return $result;
}