PHP中使用jQuery+Ajax实现分页查询多功能操作
1.首先做主页面Ajax_pag.php
代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Ajax做分页</title>
<script src="bootstrap/js/jquery-1.11.2.min.js"></script>
<script src="Ajax_pag.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
</head>
<style>
.header{
margin-top: 20px;
}
</style>
<body>
<div style="margin-top: 20px; margin-top: 20px;">
关键字：
<input id="key" type="text" name="gjz"/>
<input type="button" value="查询" id="ck" /> </div>
<table class="table table-bordered header">
<thead>
<tr>
<th>地区代号</th>
<th>地区名称</th>
<th>父级代号</th>
</tr>
</thead>
<tbody id="list"> </tbody>
</table> <div style="margin:0 auto; width:500px;">
<ul class="pagination" id="fenye"> </ul>
</div> </body>
</html>
2.然后做分页查询JS页面Ajax_pag.js
代码如下：
//ajax分页开始
var ts = 10;//每页显示的条数
var page = 1;//当前页
$(document).ready(function(e) {
//页面加载数据
Load();
//加载分页列表
Loadlist();
$("#ck").click(function(){
//页面加载数据
Load();
//加载分页列表
Loadlist();
})
}) //加载数据的方法
function Load(){
var gjz = $("#key").val();
$.ajax({
async:false,
url:"pagechuli.php",
data:{page:page,ts:ts,gjz:gjz},//page是显示的页数；ts是显示的条数
type:"POST",
dataType:"JSON",
success: function(data){
var str ="";
for(var k in data)
{
str +="<tr><td>"+data[k][0]+"</td><td>"+data[k][1]+"</td><td>"+data[k][2]+"</td></tr>";
}
$("#list").html(str);//把拼接好的字符串放到要显示的thody里面
}
})
}
//加载分页列表
function Loadlist(){
var str ="";
//上一页
str+="<li><a id='prev'>«</a></li>";
//加载列表
for(var i=page-4;i<page+5;i++){
//限制条件
if(i>0 && i<=zys()){
//判断当前页
if(i==page){
str+= "<li class='active'><a>"+i+"</a></li>";
}else{
str+= "<li><a class='item'>"+i+"</a></li>";
}
}
}
//下一页
str+="<li><a id='next'>»</a></li>";
$("#fenye").html(str); $("#prev").click(function(){
if(page>1){
page--;
}
//页面加载数据
Load();
//加载分页列表
Loadlist();
}) $(".item").click(function(){
var p = $(this).text();//取到的是字符串,转化为整数
page = parseInt(p);
//页面加载数据
Load();
//加载分页列表
Loadlist();
}) $("#next").click(function(){
if(page<zys()){
page++;
}
//页面加载数据
Load();
//加载分页列表
Loadlist();
}) } //总页数
function zys(){
var zys = 0;
$.ajax({
async:false,
url:"zyschuli.php",
dataType:"TEXT",
success:function(data){
zys = Math.ceil(data/ts);
}
});
return zys;
}
3.最后做分页查询处理页面pagechuli.php
代码如下：
<?php
$gjz = $_POST["gjz"];
$page = $_POST["page"];//获取页数显示值
$ts = $_POST["ts"];//获取每页条数显示值 require_once "./DBDA.class.php";
$db = new DBDA(); $tj = " 1=1 ";
if(!empty($_POST["gjz"])){
$gjz = $_POST["gjz"];
$tj = " areaname like '%{$gjz}%' or areacode like '%{$gjz}%' or parentareacode like '%{$gjz}%' ";
} $tg = ($page-1)*$ts;//每页显示$ts条数据，这里显示的就是当前页的$tg条数据。
$sql = "select * from chinastates where {$tj} limit {$tg},{$ts}";
echo $db->JsonQuery($sql,0)
小插件：总页数的处理页面zyschuli.php
<?php
require_once "./DBDA.class.php";
$db = new DBDA(); $sql = "select count(*) from chinastates";
echo $db->StrQuery($sql,0);
效果如图：
关键字查询：
PHP中使用jQuery+Ajax实现分页查询多功能操作的更多相关文章
- 2018.2.28 PHP中使用jQuery+Ajax实现分页查询多功能如何操作
PHP中使用jQuery+Ajax实现分页查询多功能如何操作 1.首先做主页Ajax_pag.php 代码如下 <!DOCTYPE html> <html> <head& ...
- Java进阶知识01 Struts2下的 jquery+ajax+struts 技术实现异步刷新功能
1.效果图示 横线上方的部分不动(没有刷新),下方实现刷新(异步刷新) 2.实现步骤 jquery+ajax+struts技术实现异步刷新功能的步骤: 1.需要用到 jquery+ajax+st ...
- asp.net中利用Jquery+Ajax+Json实现无刷新分页(二)
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="PageTest.aspx.cs ...
- ajax的分页查询（不刷新页面）
既然是分页查询,那么就要有张数据很多的表,可以让它进行分页显示,用普通的方法进行分页查询必然是要刷新页面的,这里要实现不刷新页面进行分页显示数据,就要用到ajax方式.进行编写代码 (1)先写个显示数 ...
- Ajax写分页查询（实现不刷新页面）
获取数据库中大量的信息显示在页面上,必然要使用到分页查询: 若不使用Ajax,而是用其他的方法,肯定是要刷新页面的,用户体检很不好, 所以最好使用Ajax的方法写分页查询: 1.先来找一张数据很多的表 ...
- ajax的分页查询
(1)先写个显示数据的页面,分页查询需要那几个部分呢? 1.首先是查询的文本框输入,还有查询按钮,那么就开始写代码吧 1 2 3 4 <div> <input type=" ...
- 用ajax写分页查询-----2017-05-17
要写分页,首先你得清楚,一页你想显示多少条信息?如何计算总共显示的页数? 先说一下思路: (1)从数据库读取数据,以chenai表为例,读取所有留言信息.并能够实现输入发送者,可以查询该发送者的留言总 ...
- 如何用ajax写分页查询（以留言信息为例）-----2017-05-17
要写分页,首先你得清楚,一页你想显示多少条信息?如何计算总共显示的页数? 先说一下思路: (1)从数据库读取数据,以chenai表为例,读取所有留言信息.并能够实现输入发送者,可以查询该发送者的留言总 ...
- 利用Linq + Jquery + Ajax 异步分页的实现
在Web显示的时候我们经常会遇到分页显示,而网上的分页方法甚多,但都太过于消耗带宽,所以我想到了用Ajax来分页,利用返回的Json来处理返回的数据, 大大简化了带宽的压力. 先说下思路,无非就是异步 ...
随机推荐
- 20165223 《JAVA程序设计》第三周学习总结
教材学习内容总结 第四章是整个JAVA语言的基础和重点,要重点学习和把握. 第四章要点 基础 类 构造方法与对象的创建 类与程序的基本结构 重点 参数传值 对象组合 JAVA独有语法 实例成员与类成员 ...
- Python3 与 C# 扩展之～模块专栏
代码裤子:https://github.com/lotapp/BaseCode/tree/maste 在线编程:https://mybinder.org/v2/gh/lotapp/BaseCode ...
- （三）flask中的请求钩子函数
请求勾子 在客户端和服务器交互的过程中,有些准备工作或扫尾工作需要处理,比如: 在请求开始时,建立数据库连接: 在请求开始时,根据需求进行权限校验: 在请求结束时,指定数据的交互格式: 为了让每个视图 ...
- spring boot集成ehcache 2.x 用于hibernate二级缓存
https://www.jianshu.com/p/87b2c309b776 本文将介绍如何在spring boot中集成ehcache作为hibernate的二级缓存.各个框架版本如下 spring ...
- 时间复杂度和大O表示法
大O表示法:称一个函数g(n)是O(f(n)),当且仅当存在常数c>0和n0>=1,对一切n>n0均有|g(n)|<=c|f(n)|成立,也称函数g(n)以f(n)为界或者称g ...
- C# winfrom容器布局与工具栏&&右键菜单栏&&隐藏显示小图标的的简单事件
前两天的时候学习了winfrom,简单地说就是各种布局,然后给按钮,textbox等各种控件添加各种事件的操作,经过前天一晚上,昨天一天的练习操作的还算熟练,但是对构造函数传值还是不是很了解,由于各种 ...
- MySQL 之 库操作，表操作
系统数据库 information_schema :虚拟库,不占用磁盘空间,存储的是数据库启动后的一些参数,如用户表信息.列信息.权限信息.字符信息等 mysql:核心数据库,里面包含用户.权限.关键 ...
- Linux常用基本命令(less)
转: Linux常用基本命令(less) LESS:跟more命令的功能类似,都是用于分页显示内容,但是他的性能比more更高,功能比more更丰富,他读取文件是按需加载 格式: less [opti ...
- Oracle的DQL
基本查询: 链接语句: sqlplus scott/tiger@192.168.56.101:1521/orcl SQL> --清屏 SQL> host cls (host clear) ...
- Day4--Python--列表增删改查,元组,range
# 一.列表# 能装东西的东西 列表中装的数据是没有限制的,大小基本上够用# 列表用[]表示# 有索引和切片 [start,end,step] ###增删改查 (重点) # 1.新增 # appent ...