Skip to content

xxzkid/js-pagehelper

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 

Repository files navigation

js-pagehelper

js-pagehelper 是一个javascript的分页插件,用户listview这种形式的加载数据,支持上拉加载数据
有待优化!
有bug请提issues,感谢


使用例子: 先引入jQuery 或者 Zepto 然后引入pagehelper.js

列表加载方式一:
进入页面就开始加载数据:

var data = getParams(); 
$.pagehelper({ 
  obj : $('.list-box > ul'), 
  url : "/user/userlist", 
  params : data, 
  buildHtml : buildHtml 
}).startPage(); 

function getParams() { 
  // ...... 获取请求需要的参数 
}

function buildHtml(json) {
  var resultHtml = ''; 
  // ...... 生成所需要的html 
  return resultHtml; 
} 

列表加载方式二:
进入页面有第一页的数据:
var data = getParams(); 
$.pagehelper({ 
  obj : $('.list-box > ul'), 
  url : "/user/userlist", 
  params : data, 
  buildHtml : buildHtml 
}).setPage(1, 100);

setPage(pageNum, pages)是设置pageNum 和 pages pageNum的意思是当前页数,pages的意思是总页数

列表加载方式三:
有搜索条件时,点击搜索确定时调用:
var data = getParams(); 
$.pagehelper({ 
  obj : $('.list-box > ul'), 
  url : "/user/userlist", 
  params : data, 
  buildHtml : buildHtml 
}).resetPage();


PS:服务器返回的数据内容:
{
  // 其他属性...
  'body':{
    'pageNum':1, // 当前页数
    'pages':100, // 总页数
    'list':[] // 内容对象集合
    // 其他属性...
  }
}

About

js-pagehelper通用分页插件

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published