js/jquery 页面分页（看别人写的看不懂，自己写了一个---仅基础知识）另自己倒一个jquery的.jar包即可使用

Posted 2020-08-27

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js/jquery 页面分页（看别人写的看不懂，自己写了一个---仅基础知识）另自己倒一个jquery的.jar包即可使用相关的知识，希望对你有一定的参考价值。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

.page a:hover{
color: #333333; }
#content_show{
text-align: center;
border: 1px solid red;

}

</style>
</head>

<body>

</body>

//初始化显示分页

//直接显示 pagenum
$(".page").html("");
$(".page").append(‘<a href="#" style="letter-spacing: 0.66px;">上一页</a> ‘);
$(".page").append(‘<span id="point_2">..</span>‘);
for (var i = 0; i < pagenum; i++) {
$(".page").append(‘<a href="#">‘+(i+1)+‘</a> ‘);
}
if(pagenum > pages){
$(".page a:eq("+pages+")").nextAll().hide();
$(".page").append(‘<span id="point_3">..</span>‘);
}

$(".page").append(‘<a href="#"style="letter-spacing: 0.66px;">下一页</a> ‘);
$("#point_2").hide();

//初始化显示内容
if(item<=total){
for (var i = 0; i < item; i++) {
$("#content_show").append($("#content div.news:eq("+i+")").clone());
}

}else{
for (var i = 0; i <total; i++) {
$("#content_show").append($("#content div.news:eq("+i+")").clone());
}
}

$(".page a:eq(1)").attr("flag","flag");

//下一页
//a,判断是否还有下一页-----得到当前页来判断
var crruntpage;
$("a").click(function(){
//点击下一页出现的当前页
//内容所处页面

$("a").each(function(){
if($(this).attr("flag")=="flag"){
crruntpage=$(this).html();
}
});

if("下一页"==$(this).html()){

if(crruntpage<pagenum){
//下一页有效
//切换内容
$("#content_show").html("");
for (var i =crruntpage*item; i < item*(parseInt(crruntpage)+1); i++) {
$("#content_show").append($("#content div.news:eq("+i+")").clone());
}
jQuery(this).siblings().attr("flag","");
jQuery(".page a:eq("+(parseInt(crruntpage)+1)+")").attr("flag","flag");
jQuery(this).siblings().css("color","#999999");
jQuery(".page a:eq("+(parseInt(crruntpage)+1)+")").css("color","red");
//翻转分页
var max_top=0;
var min_top=pagenum;
$("a").each(function(){
if($(this).attr("style").indexOf("none")>0){

if($(this).html()<crruntpage){
if($(this).html()>max_top){
max_top=$(this).html();

}
}
if($(this).html()>crruntpage){
if($(this).html()<min_top){
min_top=$(this).html();
}
}
}
});
$("#point_2").show();
if((parseInt(max_top)+parseInt(pages))<pagenum){
$(".page a:eq("+(parseInt(max_top)+1)+")").hide();

}
if((parseInt(max_top)+parseInt(pages))>=pagenum-1){
$("#point_3").hide();
}

$(".page a:eq("+(parseInt(min_top))+")").show();

/**
BUG
if((parseInt(crruntpage)+parseInt(pages))<=pagenum)
{

$(".page a:eq("+crruntpage+")").hide();
$(".page a:eq("+(parseInt(crruntpage)+parseInt(pages))+")").show();

}
if((parseInt(crruntpage)+parseInt(pages))==pagenum){
$("#point_3").hide();
$("#point_2").show();
}
**/

// crruntpage=parseInt(crruntpage)+1;
}

}
else if("上一页"==$(this).html()){
//当前页大于1有效
//切换内容
if(crruntpage>1){
$("#content_show").html("");
for (var i =(parseInt(crruntpage)-2)*item; i < item*(crruntpage-1); i++) {
$("#content_show").append($("#content div.news:eq("+i+")").clone());
}

jQuery(this).siblings().attr("flag","");
jQuery(".page a:eq("+(parseInt(crruntpage)-1)+")").attr("flag","flag");
jQuery(this).siblings().css("color","#999999");
jQuery(".page a:eq("+(parseInt(crruntpage)-1)+")").css("color","red");
//翻转分页
var max=0;
var min=pagenum;
$("a").each(function(){
if($(this).attr("style").indexOf("none")>0){
if($(this).html()<crruntpage){

if($(this).html()>max){
max=$(this).html();

}
}
if($(this).html()>crruntpage){

if($(this).html()<min){
min=$(this).html();

}

}else{
min=pagenum+1;
}
}
});
$("#point_3").show();
$(".page a:eq("+(parseInt(max))+")").show();
if(min-pages>1){
$(".page a:eq("+(parseInt(min)-1)+")").hide();
}
if(min-pages<=2){
$("#point_2").hide();
}
/**
BUG
if((parseInt(crruntpage)-parseInt(pages))>0)
{

$(".page a:eq("+crruntpage+")").hide();
$(".page a:eq("+(parseInt(crruntpage)-parseInt(pages))+")").show();

}
if((parseInt(crruntpage)-parseInt(pages))==1){
$("#point_2").hide();
$("#point_3").show();
}
**/
}
}
else{
//点击页数
$("#content_show").html("");
for (var i = (jQuery(this).html()-1)*item; i < item*jQuery(this).html(); i++) {
$("#content_show").append($("#content div.news:eq("+i+")").clone());
}
jQuery(this).siblings().attr("flag","");
$(this).attr("flag","flag");
jQuery(this).siblings().css("color","#999999");
$(this).css("color","red");

}
if(pages>=pagenum){
$("#point_3").hide();
$("#point_2").hide();
}
})

})
</script>
</html>

以上是关于js/jquery 页面分页（看别人写的看不懂，自己写了一个---仅基础知识）另自己倒一个jquery的.jar包即可使用的主要内容，如果未能解决你的问题，请参考以下文章

MySQL——用别人看不懂的方式算近3年年份

入门commander

js/jquery 页面分页（看别人写的看不懂，自己写了一个---仅基础知识） 另自己倒一个jquery的.jar包即可使用

js/jquery 页面分页（看别人写的看不懂，自己写了一个---仅基础知识）另自己倒一个jquery的.jar包即可使用