如何实现我与 php 一起使用的 simplepagination 插件？答案

【问题标题】：How to implement the simplepagination plugin that i'm using with php?如何实现我与 php 一起使用的 simplepagination 插件？
【发布时间】：2015-04-20 13:12:28
【问题描述】：

这是我的带有 php 代码的 html：

      <?php

      $sql = mysqli_query($con, "SELECT * FROM blog_posts WHERE postStatus = 'accepted' ORDER BY date_accepted DESC");

        while($row = mysqli_fetch_array($sql))

      ?>
           <article>

             <?php echo $row['postTitle']." Posted on ".date('jS M Y', strtotime($row['postDate']))." ".$row['postDesc']; ?>


           </article>
      <?php
        }
      }
      ?>


 <div id="selector">
   <ul class="selector">
      <li>
          <p>One</p>
      </li>
      <li>
          <p>Two</p>
      </li>
      <li>
          <p>Three</p>
      </li>
      <li>
          <p>Four</p>
      </li>
      <li>
          <p>Five</p>
      </li>
      <li>
          <p>Six</p>
      </li>
      <li>
          <p>Seven</p>
      </li>
          <li>
      <p>Eight</p>
          </li>
      </ul>
   </div>

这是javascript：

  $(function() {
        $(selector).pagination({
                items: 100,
                itemsOnPage: 5,
                cssStyle: 'light-theme'
        });

});

我从这里得到了这个插件： http://flaviusmatis.github.io/simplePagination.js/

我想知道的是如何在我的 php 代码中使用这个插件。就像我有 20 个帖子，我只想显示 10 个帖子。提前致谢！！

【问题讨论】：

检查更新的答案。

标签： javascript php jquery pagination

【解决方案1】：

这里的“选择器”代表一个类，所以你应该使用这个[如果你想为“li”分页]：

$(function() {
        $('.selector').pagination({
                items: 100,
                itemsOnPage: 5,
                cssStyle: 'light-theme'
        });
});

或

这里的“选择器”代表一个id，所以你应该使用这个[如果你想为“div”分页]：

$(function() {
        $('#selector').pagination({
                items: 100,
                itemsOnPage: 5,
                cssStyle: 'light-theme'
        });
});

您可以使用任何一种方法，具体取决于您希望在哪里实现分页，无论是在 li 上还是在 div 上。

对文章实现分页，给文章一个ID或者Class，然后实现分页。例如，假设文章有 id="pagin"，那么相应的分页功能应该像这样实现：

$(function() {
     $('#pagin').pagination({
           items: 100,
           itemsOnPage: 5,
           cssStyle: 'light-theme'
      });
 });

【讨论】：

嗨@sanki。我真的很感激这个答案。但我真正想知道的是如何使用我拥有的 php 代码数据进行分页。

【解决方案2】：

除了 sanki 告诉你的之外，为了使这个插件能够工作，你需要有一个已经可以工作的分页系统，也就是说，你需要改进它：

$(function() {
    $(selector).pagination({
            items: 100,
            itemsOnPage: 5,
            cssStyle: 'light-theme'
    });
});

将选择器更改为包含您的 id 或类分页占位符的选择器，然后将项目值替换为最大记录数（您可以通过查询数据库并使用 mysqli_num_rows计算总行数来实现此目的>

同样，它看起来像这样：

$(function() {
        $('.selector').pagination({
                items: <?php echo $count; ?>,
                itemsOnPage: 5,
                cssStyle: 'light-theme'
        });
});

现在你需要设置一些额外的属性：

hrefTextPrefix: 这是在您传递页码值时更改 URL 中的前缀，默认设置为 #page-，您可以将其更改为 ?page= 以便值可以通过 $_GET
传递
currentPage：这是告诉你的分页样式你当前在哪个页面，为了让它知道这个值，你需要在这里传递 $_GET 值 p>

现在，您的代码应该如下所示：

$(function() {
        $('.selector').pagination({
                items: <?php echo $count; ?>,
                itemsOnPage: 5,
                cssStyle: 'light-theme',
                hrefTextPrefix: '?page=',
                currentPage: <?php echo $_GET['page']; ?>
        });
});

就是这样，你应该让你的分页系统正常工作。

如果您需要更多信息，请查看完整的插件文档： flaviusmatis.github

【讨论】：