齐博x1标签实例：列表页制作及无滚动加载内容

代码如下:

<div class="listpages">
	{qb:listpage name="bbs_list_page_pc" rows="20" order="list"}
		<a href="{:urls('content/show',['id'=>$rs['id']])}">{$rs.title}</a> 
	{/qb:listpage}
</div>
<!--{$pages} 这是传统分页-->
<button type="button" onclick="ShowMoreList()">查看更多</button>

<script type="text/javascript">
var Mpage = 1;
//显示更多
function ShowMoreList(){
	Mpage++;
	$.get('{qb:list_url name="bbs_list_page_pc" /}'+Mpage,function(res){
		if(res.code==0){
			if(res.data==''){
				layer.msg("已经显示完了！",{time:500});
			}else{
				$('.listpages').append(res.data);
				scroll_get = true;  //这一行仅仅是匹配滚动显示更多.如果没使用滚动特效,可以删除
			}
		}else{
			layer.msg(res.msg,{time:2500});
		}
	});
}

//滚动显示更多
var scroll_get = true;	//做个标志,不要反反复复的加载
$(document).ready(function () {
	$(window).scroll(function () {
		if (scroll_get==true &&  (400 + $(window).scrollTop())>($(document).height() - $(window).height())) {
			scroll_get = false;
			layer.msg('内容加截中,请稍候',{time:1000});
			ShowMoreList();
		}
	});
});

</script>

下面这一段,就是齐博标签中的列表页标签代码

<div class="listpages">
	{qb:listpage name="bbs_list_page_pc" rows="20" order="list"}
		<a href="{:urls('content/show',['id'=>$rs['id']])}">{$rs.title}</a> 
	{/qb:listpage}
</div>

他的标志就是 {qb:listpage name="xxxx"}模板{/qb:listpage}
而通用标签是{qb:tag name="xxxx"}模板{/qb:tag}
其它参数的用法都基本一样,这里就是唯一不同的地方即:冒号后面的几个字母

{$pages}

这个是传统分页的代码,现在慢慢不太受喜欢了.体验比较差

这个是点击事件,如果你使用了滚动事件的话,这个就没有存在的意义.

var Mpage = 1;
//显示更多
function ShowMoreList(){
	Mpage++;
	$.get('{qb:list_url name="bbs_list_page_pc" /}'+Mpage,function(res){
		if(res.code==0){
			if(res.data==''){
				layer.msg("已经显示完了！",{time:500});
			}else{
				$('.listpages').append(res.data);
				scroll_get = true;  //这一行仅仅是匹配滚动显示更多.如果没使用滚动特效,可以删除
			}
		}else{
			layer.msg(res.msg,{time:2500});
		}
	});
}

上面这一段是JS代码,大部分页面都可以套用的.var Mpage = 1;这个是页码默认表示当前已显示了第一页

{qb:list_url name="bbs_list_page_pc" /}

这个代表分页网址,这也是齐博标签最特别的地方, 按以往,甚至现在很多同行, 为了实现分页显示数据,必须要单独做一个PHP文件写数据调用.而我们这里,只需要把显示标签的变量名复制到这里让他们一一对应,就可以解决了

这个分页网址标签在页面运行后,会转义成类似下面的网址
http://你的域名/index.php/bbs/content/ajax_get/name/bbs_list_page_pc/fid/16/mid/1/rows/20/order/list/by/desc/pagename/ec1e7a01/cache_time/0.html?page=
这个不需要你去记住,只是让大家知道,最后他会生成一个很特别的网址,带上各项参数并且以=号结尾,=号后面就必须要跟上页码数字

下面这一段,就是实现滚动显示更多的,如果你不想滚动显示更多,而想点击显示更多的话,就可以把下面这一段删除掉.

//滚动显示更多
var scroll_get = true;	//做个标志,不要反反复复的加载
$(document).ready(function () {
	$(window).scroll(function () {
		if (scroll_get==true &&  (400 + $(window).scrollTop())>($(document).height() - $(window).height())) {
			scroll_get = false;
			layer.msg('内容加截中,请稍候',{time:1000});
			ShowMoreList();
		}
	});
});