javascript - 如何使用 php jquery ajax 从文件夹加载更多图像

标签 javascript php jquery html ajax

我有多个文件夹,所有文件夹都包含一些图像,最多 20 张图像。 在我的 html 页面中,我想显示前 5 张图像并显示点击查看更多 15 张 当用户单击该链接时,它将显示接下来的 15 张图像

但到目前为止我只能一次获取所有图像 这是我的代码

     <?php
    $dirname = "img/outlets/".$service_type."/".  $outlet_name ."/snaps/";
    $images = glob($dirname."*.jpg");
    foreach($images as $image)
   {
     ?>
   <a href="<?php echo $image ?>" class="imageHover">
   <img src="<?php echo $image ?>" class="img-responsive" />
   </a>
   <?php 
   } 
     ?>

最佳答案

我很抱歉没有支持或全部,但我认为你应该询问或研究“分页”。您要问的是分页的定义。

实际上你是在问,“我如何实现分页?”

http://codular.com/implementing-pagination

http://code.tutsplus.com/tutorials/how-to-paginate-data-with-php--net-2928

这里有一些代码,您可以尝试实现简单的分页

try {

// Find out how many items are in the table
$total = $dbh->query('
    SELECT
        COUNT(*)
    FROM
        table
')->fetchColumn();

// How many items to list per page
$limit = 20;

// How many pages will there be
$pages = ceil($total / $limit);

// What page are we currently on?
$page = min($pages, filter_input(INPUT_GET, 'page', FILTER_VALIDATE_INT, array(
    'options' => array(
        'default'   => 1,
        'min_range' => 1,
    ),
)));

// Calculate the offset for the query
$offset = ($page - 1)  * $limit;

// Some information to display to the user
$start = $offset + 1;
$end = min(($offset + $limit), $total);

// The "back" link
$prevlink = ($page > 1) ? '<a href="?page=1" title="First page">&laquo;</a> <a href="?page=' . ($page - 1) . '" title="Previous page">&lsaquo;</a>' : '<span class="disabled">&laquo;</span> <span class="disabled">&lsaquo;</span>';

// The "forward" link
$nextlink = ($page < $pages) ? '<a href="?page=' . ($page + 1) . '" title="Next page">&rsaquo;</a> <a href="?page=' . $pages . '" title="Last page">&raquo;</a>' : '<span class="disabled">&rsaquo;</span> <span class="disabled">&raquo;</span>';

// Display the paging information
echo '<div id="paging"><p>', $prevlink, ' Page ', $page, ' of ', $pages, ' pages, displaying ', $start, '-', $end, ' of ', $total, ' results ', $nextlink, ' </p></div>';

// Prepare the paged query
$stmt = $dbh->prepare('
    SELECT
        *
    FROM
        table
    ORDER BY
        name
    LIMIT
        :limit
    OFFSET
        :offset
');

// Bind the query params
$stmt->bindParam(':limit', $limit, PDO::PARAM_INT);
$stmt->bindParam(':offset', $offset, PDO::PARAM_INT);
$stmt->execute();

// Do we have any results?
if ($stmt->rowCount() > 0) {
    // Define how we want to fetch the results
    $stmt->setFetchMode(PDO::FETCH_ASSOC);
    $iterator = new IteratorIterator($stmt);

    // Display the results
    foreach ($iterator as $row) {
        echo '<p>', $row['name'], '</p>';
    }

} else {
    echo '<p>No results could be displayed.</p>';
}

} catch (Exception $e) {
echo '<p>', $e->getMessage(), '</p>';
}

Simple PHP Pagination script

关于javascript - 如何使用 php jquery ajax 从文件夹加载更多图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33045153/

相关文章:

javascript - 过渡问题 CSS 和 JS

javascript - webpack:配置文件中 [ext] 之后的问号

php - MAMP:从 5.5 升级到 5.7 后无法启动 MySQL

javascript - 从两端调整一个div的大小

javascript - 使用 json 和 $http 从 php 数组自动完成 Angular js

javascript - 使用自定义 javascript 函数的简单选项卡切换

javascript - DOM 创建元素上的 jQuery .on() 函数问题

php - Composer 总是遇到 "Allowed memory size of 1610612736 bytes exhausted"- 在服务器和本地

php - Facebook Graph API 请求需要很长时间? (文件获取内容)

javascript - 用于选择单选按钮的 HTML 下拉列表