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来处理返回的数据, 大大简化了带宽的压力. 先说下思路,无非就是异步 ...
随机推荐
- hdu 1081 To The Max(二维压缩的最大连续序列)(最大矩阵和)
Problem Description Given a two-dimensional array of positive and negative integers, a sub-rectangle ...
- NowCoder--牛可乐发红包脱单ACM赛C_区区区间间间
题目链接:C_区区区间间间 思路:算贡献,求出每个数为当前最大值时所在的区间个数,和每个数为最小值的区间个数 和这个题有点类似 搭配食用效果更佳 点击这里 #include<bits/stdc+ ...
- Injection with CDI (Part I)
官方参考:http://docs.jboss.org/weld/reference/latest/en-US/html/index.html https://antoniogoncalves.org/ ...
- 【CH6901】骑士放置
题目大意:给定一个 N*M 的棋盘,有一些格子禁止放棋子.问棋盘上最多能放多少个不能互相攻击的骑士(国际象棋的"骑士",类似于中国象棋的"马",按照" ...
- 【洛谷P1052】过河 离散化+dp
题目大意:给定一个长度为 N 的序列,有 M 个点对答案的贡献为 1,其余为 0,现从起点出发,每次只能走 [s,t] 个单位,求从起点走到终点时答案贡献最小是多少. 题解:由于 N 很大,无法直接记 ...
- android studio adb.exe已停止工作(全面成功版 进程的查询和开启)
先输入adb看是否存在. 如果不存在则:在系统path里添加C:\Users\nubia\AppData\Local\Android\sdk\platform-tools 因为这个目录里有adb 或者 ...
- spring mvc后端校验validator
springmvc中我们使用hibernate的校验框架validation: pom: <validator.version>5.2.4.Final</validator.vers ...
- shell脚本[] [[]] -n -z 的含义解析
1.在中括号中,判断变量的值, 加不加双引号的问题?-z 判断 变量的值,是否为空: zero = 0 - 变量的值,为空,返回0,为true- 变量的值,非空,返回1,为false-n 判断变量的值 ...
- Hibernate的入门:
1 下载Hibernate5 http://sourceforge.net/projects/hibernate/files/hibernate-orm/5.0.7.Final/hibernate-r ...
- 新买苹果电脑，mac系统中小白应该了解哪些东西？
本文旨在分享新买了mac电脑,应该做哪些设置,帮助苹果电脑小白轻松上手使用mac电脑,当然,新电脑肯定是需要安装各种软件,这里,小编推荐一下可以看看小编写的mac软件装机必备Mac 装机必备软件推荐, ...