laypage+laytpl示例
程序员文章站
2022-04-18 17:13:38
...
laypage加laytpl的使用方法,技术不好,摸索了好久才弄出来。
首先去layer官网下载这两个插件,按照他们的文档引入js
然后我的代码如下:
1:html+jquery
首先去layer官网下载这两个插件,按照他们的文档引入js
然后我的代码如下:
1:html+jquery
//laypage分页
Ajaxpage();
function Ajaxpage(curr,num){
if(!num){
num=5; //num是当前要查询的数量,我这里设置了默认5条,前台可以修改要显示的数量
};
var catid=$('#catid').val(); //这是条件赛选栏目id
var starttime=$('#starttime').val();//这是条件筛选开始时间
var endtime=$('#endtime').val();//这是条件筛选结束时间
var title=$('#title').val();//这是标题关键词
$.get('{:U("Content/article")}', {
page: curr || 1,num:num,catid:catid,starttime:starttime,endtime:endtime,title:title
}, function(data){
//这一段是laytpl的模板渲染的赋值
var tpl = document.getElementById('arlist').innerHTML; //定义tpl
laytpl(tpl).render(data.info.lists, function(html){ //把获取到的json数据传给这里面
document.getElementById('article_list').innerHTML = html; //这是获取数据,然后渲染到 id为article_list的div里面
});
laypage({ //这一段是laypage的分页参数
cont: $('#AjaxPage'),
pages:data.info.allpage,
skip: true,
skin: '#23c6c8',
curr: curr || 1,
groups: 3,
jump: function(obj, first){
if(!first){
Ajaxpage(obj.curr,num)
}
}
});
});
}
//这是tpl的js模板 , 部分相同的地方我删了,留了不相同的,里面还有if标签的用法,只是这里的U方法我不知道怎么使用,就用了jquery的方法来调用一些功能
上一篇: 用封装类来合理的设计PHP项目--谈PHP项目中类的封装
下一篇: PHP中的XML应用(一)