首先非常感谢网友谢亮的无私分享,此作品是他分享到JquerySchool网站上的第一款原创Jquery插件,实现了Jquery+Ajax分页功能,插件名称(ajaxPage),此作品要配合后台程序使用,不管什么后台语言,只要返回指定结构的Json数据即可,功能非常强大,使用简单。
返回Json数据结构如下:
{
"code":1,
"recordCount":156,
"pageCount":16,
"data":[
{
"title":"标题1",
"time":"2012-05-21",
"hit":15
},
{
"title":"标题2",
"time":"2012-05-21",
"hit":15
}
]
}
用法:
1, 引用ajaxPage css文件; (该文件为页码显示样式, 可合并到你的样式里);
2, 引用 jQuery类库, 建议使用jQuery 1.8.3;
3, 引用ajaxPage.js文件;
4, $(obj).ajaxPage(setting); //obj为分页内容输出的容器, 为jQuery的选择器; 建议使用id; setting为配置的参数;
var c=a.extend({
page : 1, //当前页
pageSize : 10, //每页多少个
url : null, //后端 url, {page} 为当前页, 可以为伪静态如: xl_{page}.html
run : false,//是否开始加载
beforeSend : false,//请求前调用
complete : false,//请求后调用
pageId : null, //分页容器
noData : "\u6CA1\u6709\u627E\u5230", //没有数据时提示
content : null, //处理内容的循环,如 function () { return [list]标签是:{title},内容:{content}[/list] }
pageCount : null, //总页
recordCount : null, //总条数
isLoad : false, //是否加载过
mark : true //请求开关, true可请求, false不可
},d||{});
具体参数配置介绍请查看作品演示页面
效果如下:
如果您觉得本作品对您的学习有所帮助:
关键字:
网友谢亮 分页插件 ajaxPage json数据解析