先把框架的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. uboot的lds文件分析

    OUTPUT_FORMAT("elf32-littlearm", "elf32-littlearm", "elf32-littlearm") ...

  2. mysql utf8mb4 所引起的问题

    有一个项目需要存储ios的表情(emoji表情)这种表情虽然是utf8编码,但是一个字符需要占用4个字节,而MySQL utf8编码只能存放3字节的字符.在MySQL 5.6中,可以设置编码为utf8 ...

  3. HAProxy+Varnish+LNMP实现高可用负载均衡动静分离集群部署

    HAProxy高可用负载均衡集群部署 基本信息: 系统平台:VMware WorkStation 系统版本: CentOS Linux release 7.2.1511 (Core) 内核版本: 3. ...

  4. 多线程中的synchronized小结

    1.synchronized是Java中的关键字,是一种同步锁.它修饰的对象有以下几种: 1. 修饰一个代码块,被修饰的代码块称为同步语句块,其作用的范围是大括号{}括起来的代码,作用的对象是调用这个 ...

  5. jquery打造一款侧边弹出的垂直导航

    这是一款利用jquery动画特效和css打造的侧边弹出垂直导航,整个弹出过程比较流畅,而且代码很简单,如果你正在寻找一款带动画的垂直导航,那么可以试试这个.下面是在线demo HTML源码: 1 2 ...

  6. 3D MAX 人物骨骼建设

      3DMax方面所涉及的专业知识:                       (1)一下的关于3DMax中对于人物的设计和操作均需要在对3DMax基础知识熟练掌握的情况下进行的. (2)骨骼架设: ...

  7. C++之程序时间统计类实现

    /********** TimeCounter.h huangsy13@gmail.com **********/ #ifndef TIMECOUNTER #define TIMECOUNTER #i ...

  8. 利用Spring AOP和自定义注解实现日志功能

    Spring AOP的主要功能相信大家都知道,日志记录.权限校验等等. 用法就是定义一个切入点(Pointcut),定义一个通知(Advice),然后设置通知在该切入点上执行的方式(前置.后置.环绕等 ...

  9. JavaScript 学习笔记（三）

    本章学习内容: 1.数组的使用 2.类和对象细节. 3.this关键字的使用 4.构造函数,成员函数的使用 1.数组的使用   在任何的语言中,必须要有的就是数组了,有了数组,使得很多操作都变得非常的 ...

  10. sqlserver 字符串split

    select value from TF_NJVALUES('3C457A2D-188B-4D99-A822-2968054E1FB8,3C457A2D-188B-4D99-A822-2968054E ...