使用ajax分页
前台页面:
<table class="table table-hover">
<thead>
<tr>
<th class='hidden-xs'>代号</th>
<th>用户名</th>
<th class='hidden-xs'>产品代号</th>
<th class='hidden-xs'>观看类型</th>
<th class='hidden-xs'>审核状态</th>
<th>操作</th>
</tr>
</thead>
<tbody id="zy_bg"> </tbody>
</table>
<!--表格结束-->
<!--分页开始-->
<center>
<ul class="pagination" id="fy_list">
</ul>
<input type="hidden" value="1" id="fy_n" />//显示的页数
</center>
<!--分页结束--> </div>
</div> </div>
</div>
</div>
</div>
<!--内容结束-->
<script type="text/javascript">
$(document).ready(function(e) {
//获取分页
JiaZai();
var zys = 0;//设初始总页数为0
//页面加载数据
function JiaZai()//做一个加载的方法
{
var n = $("#fy_n").val();
$.ajax({
url:"chuli/chakan.php",
data:{n:n},
type:"POST",
dataType:"JSON",
success: function(data){
var str ="";
for(var i in data)
{
str = str+"<tr><th>"+data[i].code+"</th><th>"+data[i].bname+"</th><th>"+data[i].pdcode+"</th><th>"+data[i].lxcode+"</th><th>"+data[i].auditing+"</th><th>删除</th></tr>"; }
$("#zy_bg").html(str); }
}); //获取分页数(列表) $.ajax({
url:"chuli/zyxchuli.php",
dataType:"TEXT",
success: function(data){
//总页数
var ys = Math.ceil(data/6);//向上取整页数
zys = ys; var s = "<li><a id='fy_shang'>上一页</a></li>";
var dangqian = $("#fy_n").val(); //当前页数
for(var i=dangqian-2;i<=dangqian+2;i++)//显示的五条页数
{
if(i>0 && i<=ys)
{
if(dangqian==i)
{
s+="<li class='active'><a class='fy_zhong'>"+i+"</a></li>";
}
else
{
s+="<li><a class='fy_zhong'>"+i+"</a></li>"
}
}
}
s += "<li><a id='fy_xia'>下一页</a></li>";
$("#fy_list").html(s); //给分页列表加事件
JiaShiJian();
}
})
}
//给分页列表加事件的方法
function JiaShiJian()
{
$("#fy_shang").click(function(){
var n = $("#fy_n").val(); if(n>1)
{
n--;
}
else
{
n=1;
}
$("#fy_n").val(n); //加载数据
JiaZai();
})
$("#fy_xia").click(function(){
var n = $("#fy_n").val(); if(n<zys)
{
n++;
}
else
{
n=zys;
}
$("#fy_n").val(n); //加载数据
JiaZai();
})
$(".fy_zhong").click(function(){//点击页数跳转到当前页
var n = $(this).text();
$("#fy_n").val(n); //加载数据
JiaZai();
})
} }); </script>
后台处理页面 需要引用一个封装查询的方法,后台处理页面(chakan.php):
<?php
session_start();
include("../DBDA.class.php");
$db = new DBDA();
$uid = $_SESSION["uid"];
$n = $_POST["n"];
//echo $n;
$tg = ($n-1)*6;
$sql = "select * from buy where bname='{$uid}' limit {$tg},6";//查询有关用户名的数据,limit {$tg},6 是跳过n条数据查6条数据
echo json_encode($db->GuanQuery($sql),1);
后台处理页面(zyxchuli.php):
<?php
session_start();
$uid = $_SESSION["uid"];
include("../DBDA.class.php");
$db = new DBDA();
$sqlsj = "select count(*) from buy where bname='{$uid}'";//查询有关用户名的数据总数量
echo $db->StrQuery($sqlsj,1);
使用ajax分页的更多相关文章
- [jQuery]jQuery DataTables插件自定义Ajax分页实现
前言 昨天在博客园的博问上帮一位园友解决了一个问题,我觉得有必要记录一下,万一有人也遇上了呢. 问题描述 园友是做前端的,产品经理要求他使用jQuery DataTables插件显示一个列表,要实现分 ...
- ThinkPHP 整合Bootstrap Ajax分页
ThinkPHP Ajax分页代码 publicfunction index() { $where=array(); $name = I('name'); if(!empty($name)){ $wh ...
- yii2的分页和ajax分页
要想使用Yii分页类第一步:在控制器层加载分页类 use yii\data\Pagination;第二步: 使用model层查询数据,并用分分页,限制每页的显示条数$data = User::find ...
- [js开源组件开发]ajax分页组件
ajax分页组件 我以平均每一周出一个开源的js组件为目标行动着,虽然每个组件并不是很庞大,它只完成某一个较小部分的工作,但相信,只要有付出,总会得到回报的.这个组件主要完成分页的工作. 这张图里显示 ...
- MvcPager 概述 MvcPager 分页示例 — 标准Ajax分页 对SEO进行优化的ajax分页 (支持asp.net mvc)
该示例演示如何使用MvcPager最基本的Ajax分页模式. 使用AjaxHelper的Pager扩展方法来实现Ajax分页,使用Ajax分页模式时,必须至少指定MvcAjaxOptions的Upda ...
- MVC - 11(下)jquery.tmpl.js +ajax分页
继续 mvc-11(上).dto:http://www.cnblogs.com/tangge/p/3840060.html jquery.tmpl.js 下载:http://pan.baidu.com ...
- laraver ajax分页
,设置分页容器参考laraver手册 我的设置代码如下: ,控制器调用的方法:代码如下 ); include($path); $content = ob_get_cle ...
- PHP+jQuery 长文章分页类 ( 支持 url / ajax 分页方式 )
/* ******* 环境:Apache2.2.8 ( 2.2.17 ) + PHP5.2.6 ( 5.3.3 ) + MySQL5.0.51b ( 5.5.8 ) + jQuery-1.8 **** ...
- PHP+jQuery 列表分页类 ( 支持 url 分页 / ajax 分页 )
/* ******* 环境:Apache2.2.8 ( 2.2.17 ) + PHP5.2.6 ( 5.3.3 ) + MySQL5.0.51b ( 5.5.8 ) + jQuery-1.8.3.mi ...
- php--yii框架中的ajax分页与yii框架自带的分页
要想使用Yii分页类 第一步:在控制器层加载分页类 use yii\data\Pagination; 第二步: 使用model层查询数据,并用分分页,限制每页的显示条数 $data = Zhao::f ...
随机推荐
- jquery懒加载jquery.lazyload.js
Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...
- Big Data
Hadoop安装教程_伪分布式配置_CentOS6.4/Hadoop2.6.0 http://dblab.xmu.edu.cn/blog/install-hadoop-in-centos/ Spark ...
- Jmeter 简单用法
学习jmeter的部分用法,整理笔记: 老规矩上图: 一.录制脚本:Badboy或HTTP代理服务器: Badboy第三方软件,录制脚本后,可以直接导出为jmeter格式:再通过加载实现脚本: HTT ...
- 最新版ssh hibernate spring struts2环境搭建
最新版ssh hibernate spring struts2环境搭建 最新版spring Framework下载地址:spring4.0.0RELEASE环境搭建 http://repo.sprin ...
- mysql时间属性之时间戳和datetime之间的转换
一.datetime转换为时间戳 方案一:强制转换字段类型 use`nec`; ; ) NOT NULL COMMENT '注册时间' , ) NULL DEFAULT NULL COMMEN ...
- EL表达式查询出来的数据,下载成excel表格,很实用的
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...
- Coursera台大机器学习课程笔记4 -- Training versus Testing
这节的主题感觉和training,testing关系不是很大,其根本线索在于铺垫并求解一个问题: 为什么算法PLA可以正确的work?因为前面的知识告诉我们,只有当假设的个数有限的时候,我们才 ...
- Given a code_combination_id how can i get the code description? 获取科目组合描述
SELECT c.code_combination_id, c.concatenated_segments, apps.fa_rx_flex_pkg.get_description(101 -- p_ ...
- Web 播放声音(AMR 、WAVE)
最近甚是苦闷,属于边学边做,跳进了很多坑,别提有多惨了,不过结果还是不错滴,纵观前后,一句话足以概括 “痛并快乐着” ~~~ ok,我少说废话,下面来总结下 Web 播放声音一些注意事项. 说到 We ...
- oracle细节
1.oracle中NVL的含义: 如果oracle第一个参数为空那么显示第二个参数的值,如果第一个参数的值不为空,则显示第一个参数本来的值. 2.Oracle中in和exists的区别: 1).sel ...