先把框架的page类改造一下

路径在ThinkPHP/Library/Think/Page.class.php文件

添加一个方法 ajax_show

代码如下

<?php

    /**

     * 组装分页链接

     * @return string

     */

    public function ajax_show() {

        if(0 == $this->totalRows) return '';

        /* 生成URL */

        $this->parameter[$this->p] = '[PAGE]';

        $this->url = U(ACTION_NAME, $this->parameter);

        /* 计算分页信息 */

        $this->totalPages = ceil($this->totalRows / $this->listRows); //总页数

        if(!empty($this->totalPages) && $this->nowPage > $this->totalPages) {

            $this->nowPage = $this->totalPages;

        }

        /* 计算分页临时变量 */

        $now_cool_page      = $this->rollPage/2;

        $now_cool_page_ceil = ceil($now_cool_page);

        $this->lastSuffix && $this->config['last'] = $this->totalPages;

        //上一页

        $up_row  = $this->nowPage - 1;

        $up_page = $up_row > 0 ? '<a class="prev" href="javascript:;" data-href="' . $this->url($up_row) . '">' . $this->config['prev'] . '</a>' : '';

        //下一页

        $down_row  = $this->nowPage + 1;

        $down_page = ($down_row <= $this->totalPages) ? '<a class="next" href="javascript:;" data-href="' . $this->url($down_row) . '">' . $this->config['next'] . '</a>' : '';

        //第一页

        $the_first = '';

        if($this->totalPages > $this->rollPage && ($this->nowPage - $now_cool_page) >= 1){

            $the_first = '<a class="first" href="javascript:;" data-href="' . $this->url(1) . '">' . $this->config['first'] . '</a>';

        }

        //最后一页

        $the_end = '';

        if($this->totalPages > $this->rollPage && ($this->nowPage + $now_cool_page) < $this->totalPages){

            $the_end = '<a class="end" href="javascript:;" data-href="' . $this->url($this->totalPages) . '">' . $this->config['last'] . '</a>';

        }

        //数字连接

        $link_page = "";

        for($i = 1; $i <= $this->rollPage; $i++){

            if(($this->nowPage - $now_cool_page) <= 0 ){

                $page = $i;

            }elseif(($this->nowPage + $now_cool_page - 1) >= $this->totalPages){

                $page = $this->totalPages - $this->rollPage + $i;

            }else{

                $page = $this->nowPage - $now_cool_page_ceil + $i;

            }

            if($page > 0 && $page != $this->nowPage){

                if($page <= $this->totalPages){

                    $link_page .= '<a class="num" href="javascript:;" data-href="' . $this->url($page) . '">' . $page . '</a>';

                }else{

                    break;

                }

            }else{

                if($page > 0 && $this->totalPages != 1){

                    $link_page .= '<span class="current">' . $page . '</span>';

                }

            }

        }

        //替换分页内容

        $page_str = str_replace(

            array('%HEADER%', '%NOW_PAGE%', '%UP_PAGE%', '%DOWN_PAGE%', '%FIRST%', '%LINK_PAGE%', '%END%', '%TOTAL_ROW%', '%TOTAL_PAGE%'),

            array($this->config['header'], $this->nowPage, $up_page, $down_page, $the_first, $link_page, $the_end, $this->totalRows, $this->totalPages),

            $this->config['theme']);

        return "<div>{$page_str}</div>";

    }

?>

然后在提供后端数据的控制器中这样写代码

代码如下：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

    <link href="https://cdn.bootcss.com/bootstrap/4.0.0-alpha.3/css/bootstrap.css" rel="stylesheet">

    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>

</head>

<style>

    #page a{margin: 2px}

</style>

<body>

<div class="container">

    <table class="table table-striped table-condensed">

        <thead>

            <tr>

                <td>username</td>

                <td>email</td>

            </tr>

        </thead>

        <tbody id="data_list"></tbody>

    </table>

    <div id="page"></div>

</div>

<script>

    $(function(){

        get_data("http://localhost/thinkphp/");//初始化

        $("body").on('click','#page a',function(){

            get_data($(this).attr("data-href"));

        });

    });

    function get_data(url)

    {

        $.getJSON(url,{},function(res){

            var html="";

            for (var i = 0; i < res.data.length; i++) {

                html+="<tr><td>"+res.data[i].username+"</td><td>"+res.data[i].email+"</td></tr>";

            };

            $("tbody").html(html);

            $("#page").html(res.page);

        });

    }

</script>

</body>

</html>

演示效果如下：

THINKPHP ajax分页示例的更多相关文章

  1. ThinkPHP AJAX分页及JS缓存的应用

    //AJAX分页详见兄弟连PHP项目视频教程22讲35分钟左右 主要实现是需要将分页中的每个链接都改为AJAX请求 //前端缓存技术:基于javascript传输的数据,只要浏览器没关,都保存在内存中 ...

  2. thinkphp ajax分页

    临时更改后的page类(很多地方没修改...因为笔者PHP没学好..)如下: 复制代码 <?php namespace Fenye\libs; /** file: page.class.php ...

  3. thinkphp ajax分页加载更多最简单的实现方法

    <div class="li_list"> <volist name="list" id="vo"> <div ...

  4. ThinkPHP 整合Bootstrap Ajax分页

    ThinkPHP Ajax分页代码 publicfunction index() { $where=array(); $name = I('name'); if(!empty($name)){ $wh ...

  5. 【TP3.2】TP3.2下实现ajax分页（原创+亲测可用）

    一,写在最开始:ajax分页的原理,是利用了js的ajax执行请求,获取分页list和分页page [代码块],去替换页面显示数据的[代码块] 技术:js的ajax + TP3.2的fetch(&qu ...

  6. thinkphp中的ajax分页

    thinkphp中用ajax分页和普通的ajax分页的区别在于处理位置的不同,thinkphp是在控制器的方法中处理ajax传的值,然后返回数据.下面是一个点击事件触发后,显示的内容用ajax分页. ...

  7. MvcPager 概述 MvcPager 分页示例 — 标准Ajax分页 对SEO进行优化的ajax分页 (支持asp.net mvc)

    该示例演示如何使用MvcPager最基本的Ajax分页模式. 使用AjaxHelper的Pager扩展方法来实现Ajax分页,使用Ajax分页模式时,必须至少指定MvcAjaxOptions的Upda ...

  8. python 全栈开发，Day87(ajax登录示例,CSRF跨站请求伪造,Django的中间件,自定义分页)

    一.ajax登录示例 新建项目login_ajax 修改urls.py,增加路径 from app01 import views urlpatterns = [ path('admin/', admi ...

  9. Thinkphp+Ajax带关键词搜索列表无刷新分页实例

    Thinkphp+Ajax带关键词搜索列表无刷新分页实例,两个查询条件,分页和搜索关键字,懂的朋友还可以添加其他分页参数. 搜索#keyword和加载内容区域#ajax_lists <input ...

随机推荐

  1. gradle本地文件仓库 (52.6.5. Flat directory repository)

    If you want to use a (flat) filesystem directory as a repository, simply type: Example 52.32. Flat r ...

  2. text-align 在ie7与ie8下的区别

      在某元素上应用text-align:center; 在ie7下解释为,该元素内的元素和文字都居中. 在ie8下解释为,该元素内的文字居中. 例如:<div style="borde ...

  3. 【C++程序员学 python】python 之奇葩地方

    一.python 奇葩之一:没有花括号.没有分号 先来一个C类型的函数 void main() { int i = 0; for(int j = 0; j< 6;j++) { i = i +j; ...

  4. J2EE面试题集锦_

    一.基础问答 不能被继承的类有[Long  Double  Float  Short  Void  Class  Math  String] 他们都被final修饰         类可以被继承[Th ...

  5. spark sql 入门

    package cn.my.sparksql import cn.my.sparkStream.LogLevel import org.apache.spark.{SparkConf, SparkCo ...

  6. 【C#】删除集合（Collection）里的元素（Item）

    问题:C#中如果想要删除一个集合中的所有元素,直接for循环边读边删除是不可行的.因为每删除一个元素,后面的元素就会往前排,即它们的索引会向前-1,然后i还是正常的自增,就会跳过下一个元素. // 错 ...

  7. C++类的实例化对象的大小之sizeof()

    之所以写这篇<C++类的实例化对象的大小之sizeof()>.是由于在參加笔试的时候遇到例如以下这么一道题,当时感觉就是这个一个坑,但.我还是义无反顾的跳了下去,由于存在知识点盲区啊.现, ...

  8. spring boot 自学笔记(四) Redis集成—Jedis

    上一篇笔记Reddis集成,操作Redis使用的是RedisTemplate,但实际中还是有一大部分人习惯使用JedisPool和Jedis来操作Redis, 下面使用Jedis集成示例. 修改Red ...

  9. 05 Oracle process

    本章提要----------------------------------------------所有的 process 都是在 PGA 内(memory)server process: 与 cli ...

  10. C++（1）C++类四个默认函数---构造函数、析构函数、拷贝函数、赋值函数

    C++构造函数和析构函数 默认构造函数指不带参数或者所有参数都有缺省值的构造函数!!! (1)构造函数.析构函数与赋值函数 构造函数.析构函数与赋值函数是每个类最基本的函数.它们太普通以致让人容易麻痹 ...