评论：简单的jQuery分页插件  [查看原文]

刷新页面时会初始化怎么办

葬梦1
2017/4/29 22:43:32

不是很理解，按我自己的理解，在页面加载的时候不要执行初始化就好了，理解不好，见谅，提供一种思路，仅作参考

var pageTakes={
    "init":function(page){
          //这里是你要执行的代码（获取数据，显示数据等），但是要获取数据总量，如M
         $("#page").initPage(M, page, tt);
    }
}
function tt(page){
     //不用刷新页面，直接获取数据更换你之前显示的就好
   pageTakes.init(page);
}

您好，请问页数是怎么设定的呢?

像演示中的页数是8页，这是从哪个参数设定的?

葬梦3
2017/4/29 22:41:48

这里有几个参数，我整理下：

总量（M），当前页（P）

$("#page").initPage(M,P,tt);

分页最多显示个数（S），每一页显示个数（L）

<ul class="page" maxshowpageitem="S" pagelistcount="L"  id="page"></ul>

页数和M,L有关

比如说：一共10条数据（M=10），每一页显示4条（L=4），那么页数就是根据这两个算出得到为3

function tt(dd) {
    //根据页码去获取数据 
    document.location.href = "xxxx.do?index=" + dd;
    alert(dd);
}
$("#page").initPage(71, 1, tt);

这里会死循环，当初始化页面会执行$("#page").initPage(71,1,tt); 

又会去执行function tt(dd)      又获取新的数据document.location.href="xxxx.do?index="+dd; 

获取数据后又刷新页面，又会执行$("#page").initPage(71,1,tt);

导致死循环！！  

谭晓龙0
2017/4/27 9:14:00

解决了 

加了一个判断当前页和点击页是否一样 

再去获取数据

久恋0
2017/4/28 9:22:43

怎么解决的，求解

葬梦3
2017/4/29 22:35:20

抱歉，回复晚了，我给你一个建议，这是我自己的一个写法，你作参考，如果有什么疑问，可以继续留言

var pageTakes={
    "init":function(page){
          //这里是你要执行的代码（获取数据，显示数据等），但是要获取数据总量，如M
         $("#page").initPage(M, page, tt);
    }
}

function tt(page){
     //不用刷新页面，直接获取数据更换你之前显示的就好
   pageTakes.init(page);
}

个人比较喜欢用json，控制JS，更改页面内容，不喜欢刷新页面，所以这是我常用的做法，仅供参考，至于你说的这个，我想了一下,不是很能理解

function tt(dd) {
    //根据页码去获取数据 
    document.location.href = "xxxx.do?index=" + dd;
    alert(dd);
}
$("#page").initPage(71, 1, tt);//如果是刷新页面起码应该把这个1改成当前页面的页码吧

萧矢式0
2017/6/1 15:19:45

我也遇到这个强制刷新的问题

var GG = {
    "kk": function(mm) {
        //如果在这里点击的话跳转到当前页面
        window.location.href = "${webPath}/home/index?pageNo=" + mm + ""
    }
}
$("#page123456").initPage("${total}", "${pageNo}", GG.kk);

萧矢式0
2017/6/1 15:20:22

请问怎么解决的

ajax放回调函数这里直接报格式错误，是这样引用的么？可以看下你的具体些的引用代码么？

葬梦3
2017/4/26 21:23:21

ajax放回调函数？是下面这样？

function tt(dd){
    //ajax代码
}

源码：page.js第60行

"initPageEvent":function(listCount,fun){
        $("#"+page.pageId +">li[class='pageItem']").on("click",function(){
            page.setPageListCount(listCount,$(this).attr("page-data"),fun,true);
        });
    },

接着执行：

/**
     * 设置列表总量和当前页码
     * @param listCount 列表总量
     * @param currentPage 当前页码
     */
    "setPageListCount":function(listCount,currentPage,fun,takeOnclick){
        listCount = parseInt(listCount);
        currentPage = parseInt(currentPage);
        page.initWithUl(listCount,currentPage);
        page.initPageEvent(listCount,fun);
        if(takeOnclick){
            if(typeof fun == "function"){
                fun(currentPage);
            }
        }
    },

fun(currentPage); 这个就是执行毁掉函数，cuurentPage就是你点击的页码

所以在里面使用Ajax基本上是不会出错的。

若我想要显示前面1、2、3页和最后一页（比如第15页）的按钮，在您的插件里，应该怎么设置？

（不能上图，我先用以下代码表示，我想要的效果图）

<ul class="leftfloat">
   <li>上一页</li>
   <li>首页</li>
   <li>1</li>
   <li>2</li>
   <li>3</li>
   <li>…</li>
   <li>15</li>
   <li>尾页</li>
   <li>下一页</li>
 </ul>

葬梦0
2017/4/29 23:08:49

抱歉，最近比较忙就没有写，已经写好了，但是不打算上传，就让这个以最简单的形式存在。

写好的在这个链接下：https://pan.baidu.com/s/1ge8rWUB，如果失效可留言邮箱，我会发送给你，使用方法和这个一样

$('#page').on('click', '.pageItem', function (){
    console.log(22);
});

为什么我这样写，事件没有响应

葬梦0
2017/4/24 22:00:10

因为我已经给它写了点击事件

有问题，ajax刷新数据的时候，数据更新快的时候，总行数会变，这个控件不支持改变页数

Hclang0
2017/4/21 16:07:50

改变总行数

葬梦1
2017/4/24 22:22:24

$("#page").initPage(71,1,tt);

第一个参数就是总行数，不过你刷新页面或者在点击页码的时候重新初始化就好

一个html显示两个以上的分页怎么弄？

这样不是被最后的分页给覆盖了吗

葬梦0
2017/4/24 22:16:30

有道理，好像，是有这样的问题，谢谢你的反馈，我会做出修改

葬梦1
2017/4/24 22:20:23

我看过了，讲道理的话是不会出现这个问题的，只要两个分页设置的id不一样就OK，你可以看下page.js这个文件第59行，事件的绑定和id有关

$("#"+page.pageId +">li[class='pageItem']").on("click",function(){
    page.setPageListCount(listCount,$(this).attr("page-data"),fun,true);
});

但是如果写两个，需要两个初始化

页数太多了的话每个页码都会显示出来，不是很好

葬梦1
2017/4/24 22:09:50

maxshowpageitem="5"

可以自己设定最多显示的个数，在容器中写上这个参数就好，不知道理解的是不是你的意思，有什么好的建议，可以留言互相学习

大哥，我想获取数据，我应该写到哪里

葬梦1
2017/4/24 22:15:28

抱歉！最近没怎么看，回复晚了

获取数据可以自己写方法，比如说这样：

function init(page){
    这里是你获取数据的方法    $("#page").initPage(summerNumber,page,init);
}

注意：

$("#page").initPage(summerNumber,page,init);

这个就是我们的初始化方法，至于这几个参数的意思我在上面也讲了，你回头看看

完美，赞赞赞

简单粗暴，真心不错，好用，楼上的各位，我觉得作者说的很清楚啊，实在不明白，拜托各位可以修改修改数据自己试试不就知道了吗，不用不试怎么知道，对吧，挺好用的，虽然我只是试试demo，还没用项目，但是简单实在。赞一个

葬梦0
2017/4/24 22:06:49

谢谢！

葬梦1
2017/4/24 22:06:22

分页的数据往哪显示如果知道的话，那就知道分页的数据往哪里放了，我这里推荐两个方法：

1、写一个json信息，在你放分页数据的地方记录这个json信息，怎么记录呢？可以自己设定一个熟悉如：

<div data="{.......}"></div>

2、可以利用jquery的data()方法（推荐），如：

$("#xxx").data("data",你的数据)