按下“下一步”按钮时，Jquery Pagination不起作用

Question

我制作了一个分页脚本，可以显示。 按下“下一步”按钮时，我将遇到问题，分页无法继续到下一页。 当网址发生变化但页面仍然在第一位时。

例如：

[1]。 http:// localhost /pagination/
这有效，可以在第1页上显示数据1-10。

[2] http:// localhost /pagination/?page=2
分页应该在第2页，但显示的数据是1-10（据说是11-20）

这是代码：

// data_students.php

<?php
require 'conn.php';
open_conn();
?>

<table class="table table-condensed table-bordered table-hover" cellpadding="0" cellspacing="0">
<thead>
        <tr>
                <th style="width:20px">No</th>
                <th style="width:120px">NIM</th>
                <th style="width:200px">Name</th>
                <th>Address</th>
                <th style="width:120px">Room</th>
                <th style="width:120px">Status</th>
                <th style="width:40px"></th>
       </tr>
</thead>
<tbody>
        <?php 
                $i = 1;
                $num_pages = 10;
                $num_data = mysql_num_rows(mysql_query("SELECT * FROM students"));
                $total_page = ceil($num_data / $num_pages);

                // query searching
                if(isset($_POST['search'])) {
                        $key = $_POST['search'];
                        echo "<strong>Search results for keyword: $key</strong>";
                        $query = mysql_query("
                                SELECT * FROM students 
                                WHERE nim LIKE '%$key%' 
                                OR name LIKE '%$key%'
                                OR address LIKE '%$key%'
                                OR room LIKE '%$key%'
                                OR status LIKE '%$key%'
                        ");
                // query if the specified page number
                } elseif(isset($_GET['page']) && $_GET['page']!="") {
                        $page = $_GET['page'];
                        $i = ($page - 1) * $num_pages  + 1;
                        $query = mysql_query("SELECT * FROM students ORDER BY name ASC LIMIT ".(($page - 1) * $num_pages).", $num_pages");
                // query when there is no parameter page and search
                } else {
                        $query = mysql_query("SELECT * FROM students ORDER BY name ASC LIMIT 0, $num_pages");
                }

                // show database students
                while($data = mysql_fetch_array($query)) {
                        if($data['status']==1) {
                                $status = "Active";
                        } else {
                                $status = "Off";
                        }
        ?>
        <tr>
                <td><?php echo $i ?></td>
                <td><?php echo $data['nim'] ?></td>
                <td><?php echo $data['name'] ?></td>
                <td><?php echo $data['address'] ?></td>
                <td><?php echo $data['room'] ?></td>
                <td><?php echo $status ?></td>
                <td>
                        <a href="#dialog-students" id="<?php echo $data['kd_mhs'] ?>" class="change" data-toggle="modal">
                                <i class="icon-pencil"></i>
                        </a>
                        <a href="#" id="<?php echo $data['kd_mhs'] ?>" class="delete">
                                <i class="icon-trash"></i>
                        </a>
                </td>
        </tr>
        <?php
                $i++;
                }
        ?>
</tbody>
</table>

<?php if(!isset($_POST['search'])) { ?>
<!-- to display the menu page -->
<div class="pagination pagination-right">
  <ul>
    <?php for($i = 1; $i <= $total_page; $i++) { ?>
    <li class="page" id="<?php echo $i ?>"><?php echo '<a href="?page='.$i.'">'.$i.'</a>' ;?></li>
    <?php } ?>
  </ul>
</div>
<?php } ?>

<?php 
close_conn(); 
?>

这是jquery：

// students-app.js

(function($) {
        // function is executed after the entire document is displayed
        $(document).ready(function(e) { 

                var kd_mhs = 0;
                var main = "data_students.php";
                // show data students from data_students.php in index.php <div id="data-students"></div>
                $("#data-students").load(main);


                // when the search inputbox filled
                $('input:text[name=searching]').on('input',function(e){
                        var v_search = $('input:text[name=searching]').val();
                        if(v_search!="") {
                                $.post(main, {search: v_search} ,function(data) {
                                        $("#data-students").html(data).show();
                                });
                        } else {
                                $("#data-students").load(main);
                        }
                });


                // when the button page is pressed 
                $('.page').live("click", function(event){
                        // take the value of the inputbox
                        kd_page = this.id;

                        $.post(main, {page: kd_page} ,function(data) {
                                $("#data-students").html(data).show();
                        });
                });


        });
}) (jQuery);