jquery如何优化分页操作
这篇文章主要介绍jquery如何优化分页操作，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！
成都创新互联公司自2013年创立以来，先为南郑等服务建站，南郑等地企业，进行企业商务咨询服务。为南郑企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。
创建数据库语句
CREATE TABLE `news` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`title` varchar(255) NOT NULL,
`time` timestamp NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=201 DEFAULT CHARSET=utf8
记录查询页面
test.php
set_charset("utf8");
$query = $mysqli->query("SELECT * FROM news");
$res = $query->fetch_all(MYSQLI_ASSOC);
echo json_encode($res);分页显示页面
index.html
Title
.page{
width: 1000px;
margin-left: auto;
margin-right: auto;
text-align:center;
display:none;
}
$(function(){
var avgNum = 18; //每页显示18条记录
$.ajax({
type:"GET",
url:"http://localhost/test.php",
dataType:"json",
success:function(data){
var totalPage = data.length; //获取总的记录数
var pageNum = Math.ceil(totalPage/avgNum); //计算得到页数
var content = '';
for(var i=1;i<=pageNum;i++){
content += '';
for(var j=((i-1)*avgNum);j<(i*avgNum)&&j'+data[j].title+'';
}
content += '
';
content += '
';
//前一页
if(i == 1){
content += '<< ';
}else{
content += '
<< ';
}
//后一页
if(i == pageNum){
content += '>> ';
}else{
content += '>> ';
}
content += ' ';
}
//生成所有的div，并隐藏
$("#listTag").append(content);
showPage(1);
}
});
});
function showPage(num){
$("#page"+num).show();
$("#page"+num).siblings().hide();
}