先把框架的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. gulp——myself配置

    var gulp = require('gulp'), uglify = require('gulp-uglify'), concat = require('gulp-concat'); var pu ...

  2. js实现点击按钮实现上一张下一张相册滚动效果

    /****判断图片是否构成滚动效果*/$(function(){    if($("#bar").find('img').size()*71<=$("#bar&qu ...

  3. ASP.NET(C#)不提示直接关闭当前页面

    protected void Button1_Click(object sender, EventArgs e) { //关闭页面--要弹出提示(IE6及以下不弹出提示) ClientScript.R ...

  4. C# Winform获取bin目录的路径

    //获取到bin目录的下层路径:bin\Debug\ string aa = System.AppDomain.CurrentDomain.SetupInformation.ApplicationBa ...

  5. pthread_setschedparam

    #include <stdlib.h> #include <pthread.h> #include <stdio.h> #include <sched.h&g ...

  6. Nginx动静分离知识及配置

    Nginx动静分离知识及配置,本质上与分离上传下载功能是相同功能,本质就是在文件服务器也是需要部署WEB应用的,只是在进行代理分离的时候分配到对应的文件服务器上去. 随着Nginx高性能Web服务器大 ...

  7. [转]Handler学习笔记(二)

    一.一个问题 有这样一个问题值得我们思考,若把一些类似于下载的功能(既耗时且不一定有结果)写在Activity(主线程)里,会导致Activity阻塞,长时间无响应,直至页面假死(如果5秒钟还没有完成 ...

  8. mysql 授权的时候库名不能添加单引号homestead.* 写成 '库名'.* 错的语法

    create user 'wechat'@'192.168.10.%' identified by 'xxxxx'; create database 库名DEFAULT CHARSET utf8 CO ...

  9. php 连接数据库

    连接数据库 <?php $con = mysql_connect("localhost","root","root"); if (!$ ...

  10. ImageNet Classification with Deep Convolutional Neural Networks 论文解读

    这个论文应该算是把深度学习应用到图片识别(ILSVRC,ImageNet large-scale Visual Recognition Challenge)上的具有重大意义的一篇文章.因为在之前,人们 ...