【问题标题】:Increment count on page load页面加载的增量计数
【发布时间】:2025-12-20 18:00:12
【问题描述】:

我正在尝试使用 Jquery 创建缩略图分页。一切正常。我唯一的问题是我不知道如何在每个页面加载时增加计数。下面是我的代码。我的主要目标是,如果用户单击下一个按钮,我想增加 1 php/reverse.php?page="+page。如果 php 没有更多结果,则不允许再增加。上一个按钮也是如此。

    <html>
  <head>
    <title></title>
  </head>
  <body>
      <div id="par"></div>
      <input type="button" id="prev" value="Prev"/>
      <input type="button" id="next" value="Next"/>

      <script src="js/jquery.js"></script>
      <script>
        var default_val = 1;
        function get_page(page){
          $.ajax({
            url: "php/reverse.php?page="+page
          }).done(function(data) {
            $('#par').html(data.thumbs);
          });
        }

        $('#prev').click(function(){
            get_page(default_val)
        });


        $('#next').click(function(){
         get_page(default_val+1)
        });

        get_page(default_val);
      </script>
  </body>
</html>

这是我的 PHP:

<?php
  require '../php/connect.inc.php';
  $per_page = 4;

  $pages_query = mysql_query("SELECT COUNT('id') FROM my_list");
  $pages = ceil(mysql_result($pages_query, 0) / $per_page);

  $page = (isset($_GET['page'])) ? (int)$_GET['page'] : 1;
  $start = ($page - 1) * $per_page;


  $query = mysql_query("SELECT id, image_small FROM my_list LIMIT $start, $per_page");

  $results = array();
  while($mysql_fetch_assoc = mysql_fetch_assoc($query)){    
    $results[] = "<img src='img/".$mysql_fetch_assoc['image_small']."'/>";
  }      


  header('Content-type: application/json');

  echo json_encode(array(
    'thumbs' => $results,
    'pages' => $pages,
    'current_page' => $page,
    'per_page' => $per_page
  ));
?>

【问题讨论】:

标签: php jquery ajax pagination


【解决方案1】:

首先你需要返回请求的状态

var page = 1;
function get_page(page){
  $.ajax({
    dataType: 'json',
    url: "php/reverse.php?page="+page
  }).done(function(data) {
    if (data.thumbs.length>0) {
      $('#par').html(data.thumbs);
      return true; // here
    } else
      return false; // and here
  });
}

接下来,你想要的是阻塞函数,当 json 将返回 false 并增加或减少页数

var block_next = false,
    block_prev = false;

$('#prev').click(function(){
  block_next = false;
  if (!block_prev)
    if (!get_page(page))
      block_prev = true;
    else
      page = page - 1;
});

$('#next').click(function(){
  block_prev = false;
  if (!block_next)
    get_page(page+1)
      block_next = true;
    else
      page = page + 1;
});

【讨论】: