使用JSON实现分页可直接用

Fenye.html

<!DOCTYPE html>
<html>
<head>
<title>JSON分页</title>
</head>
<body> <script type="text/javascript">
function getPageList(pageno){ var req=new XMLHttpRequest();
req.open('get','./JSON_Fenye.php?pageno='+pageno);
req.onreadystatechange=function(){
if(req.readyState==4 && req.status==200){ //将传来的字符串转化为对象
eval('var info='+req.responseText);
var str='<tr><th>ID</th><th>姓名</th><th>邮箱</th><th>等级</th></tr>'; //循环取出info对象中的数据
for(var i=0,n=info.length-1;i<n;i++){
str+='<tr><td>'+info[i].id+'</td><td>'+info[i].name+'</td><td>'+info[i].email+'</td><td>'+info[i].level+'</td></tr>';
} //分页链接
str+='<tr><td colspan="4" align="center">';
for(var i=1;i<=info[info.length-1];i++){ str+='<a href="javascript:void(0)" onclick="getPageList('+i+')">'+i+'</a>&nbsp;';
console.log(i);
}
str+='</td></tr>'; //把数据输出到浏览器
document.getElementById('result').innerHTML=str;
}
}
req.send(null);
} //默认显示第一页
window.onload=function(){
getPageList(1);
}
</script> <table id='result'></table>
</body>
</html>

Fenye.php

<?php 

/**
*JSON分页
*/ //链接数据库
@mysql_connect('localhost','root','');
@mysql_select_db('empmanage');
@mysql_query('set name utf8'); //获取总记录数
$rs = mysql_query('select count(*) from emp');
$rows = mysql_fetch_row($rs);
$recordCount = $rows[0]; //每页显示多少条pageSize
$pageSize = 5; //总页数 = 总记录/每页显示多少
$pageCount=ceil($recordCount/$pageSize); //获取当前页 三元运算 若不存在pageNow则默认显示第1页
$pageNow = isset($_GET['pageNow'])? $_GET['pageNow']:1; if ($pageNow < 1) {
$pageNow = 1;
}elseif ($pageNow > $pageCount) {
$pageNow = $pageCount;
} //起始位置 每页从第几条数据显示
$pageStart = ($pageNow-1)*$pageSize; //从哪条开始显示,限制每页显示几条
$sql = "select * from emp limit $pageStart,$pageSize"; //链接数据库
$rs = mysql_query($sql); //定义数组,把数据存放在数组中
$info = array();
while ($rows = mysql_fetch_assoc($rs)) {
$info[] = $rows;
} //将总页码保存到数组
$info[] = $pageCount; echo json_encode($info); ?>

使用JSON实现分页的更多相关文章

  1. 基于Jquery+Ajax+Json实现分页显示

    1.后台action产生json数据. List blackList = blackService.getBlackInfoList(mobileNum, gatewayid, startDate, ...

  2. js 从一个json拼接成另一个json,并做json数据分页table展示

    先给数据: //原始json数据json = [{"id":"1","aid":"013","performa ...

  3. Javascript实例技巧精选(6)—滚动鼠标中键读取Json数据分页显示网页内容

    >>点击这里下载完整html源码<< 截图如下: 滚动鼠标中键读取Json数据分页显示网页内容,关键的Javascript如下: <script type="t ...

  4. jQuery +ajax +json+实现分页

    正文 首先我们创建一般处理程序,来读取数据库中内容,得到返回值. 创建文件,GetData.ashx. 我这里是用的存储过程,存储过程会再下面粘出来,至于数据只是实例,你们可根据需求自行读取数据 代码 ...

  5. javascript实现json页面分页

    下午有个朋友问json 数据怎么分页 就捣鼓了一个东东出来 下面直接代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitio ...

  6. 基于Jquery+Ajax+Json+高效分页

    摘要 分页我相信大家存储过程分页已经很熟悉了,ajax更是耳熟能详了,更别说我们的json,等等. 如果说您没用过这些东东的话,我相信看完这篇博文会对您有帮助的,,如果有任何问题不懂或者有bug没问题 ...

  7. 实习小白笔记一(鼠标悬停、获取多选、提交修改、layer页面、单元格文字长度、json、分页、左连接)

    ①easyui 当鼠标悬停显示单元格信息: $(this).datagrid('doCellTip',{'max-width':'600px','delay':300}); ②jquery 获取che ...

  8. jquery+json实现分页效果

    son作为一种轻量级的数据交换格式,由于其传输数据格式的方便性,今天偶然想将其应用于分页实现,分页做为web开发一个长久的话题,其应用的高效与重要性就不多说了本文主要技术:反射机制,Json数据格式, ...

  9. ASP.NET MVC获取微信返回的json数据分页

    View @model JiaYe.WeiXin.Models.ViewModels.UserViewModel <div class="pull-left pagination&qu ...

随机推荐

  1. javaweb 项目的异常处理

    首先关于异常的分类: java 中关于异常的分类情况是:throwable 是所有异常和错误的基类,下面在分为Error 和 Exception: 简单的异常体系结构如下图所示: 其中Exceptio ...

  2. POJ 2301

    #include<iostream> #include<stdio.h> using namespace std; int main() { //freopen("a ...

  3. 微信小程序web-view(webview) 嵌套H5页面 唤起微信支付的实现方案

    场景:小程序页面有一个web-view组件,组件嵌套的H5页面,要唤起微信支付. 先讲一下我的项目,首先我是自己开发的一个H5触屏版的商城系统,里面含有购物车,订单支付等功能.然后刚开始,我们公众号里 ...

  4. expect中使用exec执行shell命令

    今天想在expect脚本中获取本机ip,执行脚本是报错,脚本如下: set localip [exec ifconfig eth0 | grep Mask | cut -d: -f2 | awk '{ ...

  5. java android中日期时间 问题总结

    Date 类型: Date date = new Date();   // 代表获取当前系统日期和时间 System.out.println(date); 使用类的方法设置时间和日期:(通过该方法初始 ...

  6. JBoss Web和Tomcat的区别

    在Web2.0的时代,基于Tomcat内核的JBoss在J2EE应用服务器领域已成为发展最为迅速的应用服务器.这一青出于蓝而胜于蓝的产品与Tomcat的区别又在哪里? 基于Tomcat内核,青胜于蓝. ...

  7. Sharepoint Timer job问题汇总

    解决方案发布最好发布到GAC中,使用WebApplication很多时候会有问题.TimerJob并非是在IIS下运行,所以发布到wss目录下的dll不能使用. 如果解决方案中只有一个Timer Jo ...

  8. rem手机端适配

    <script> document.documentElement.style.fontSize=document.documentElement.clientWidth*100/750+ ...

  9. 前端JS校验银行卡卡号和身份证号码(附ES6版方法)

    1.银行卡卡号校验方法. function luhnCheck(bankno) { var lastNum = bankno.substr(bankno.length - 1, 1); //取出最后一 ...

  10. Hadoop提交作业流程

    一 .需要知道的内容 1.ResourceManager ------>yarn的老大 2.NodeManager        ------>yarn的小弟 3.ResourceMana ...