TP 实现AJAX 加载分页。无需要写API，直接加载HTML，从中取出需要的部份和分页部份，真是绝了啊

	
	<ul class="caselist">
		 {volist name="list" id="v"}
		 <li>
		 	<a href="{:u('project',$v.id)}">
		 	<p class="pic"><img src="__PUBLIC__{$v.img}" class="lazy lazyload" alt=""></p>
		 	<h2>{$v.title}</h2>
		 	<p>{$v.subtitle}</p>
		 	</a>
		 </li>
		 {/volist}
	</ul>
	<div class="page" style="display:none;">{$page}</div>
	<div class="promore" style="display:none;">
		<svg class="lds-message" width="60" height="40" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid">
				<g transform="translate(25 50)">
						<circle cx="0" cy="0" r="6" fill="#e60012" transform="scale(0.953665 0.953665)">
								<animateTransform attributeName="transform" type="scale" begin="-0.3333333333333333s" calcMode="spline" keySplines="0.3 0 0.7 1;0.3 0 0.7 1" values="0;1;0" keyTimes="0;0.5;1" dur="1s" repeatCount="indefinite"></animateTransform>
						</circle>
				</g>
				<g transform="translate(50 50)">
						<circle cx="0" cy="0" r="6" fill="#e60012" transform="scale(0.567334 0.567334)">
								<animateTransform attributeName="transform" type="scale" begin="-0.16666666666666666s" calcMode="spline" keySplines="0.3 0 0.7 1;0.3 0 0.7 1" values="0;1;0" keyTimes="0;0.5;1" dur="1s" repeatCount="indefinite"></animateTransform>
						</circle>
				</g>
				<g transform="translate(75 50)">
						<circle cx="0" cy="0" r="6" fill="#e60012" transform="scale(0.125244 0.125244)">
								<animateTransform attributeName="transform" type="scale" begin="0s" calcMode="spline" keySplines="0.3 0 0.7 1;0.3 0 0.7 1" values="0;1;0" keyTimes="0;0.5;1" dur="1s" repeatCount="indefinite"></animateTransform>
						</circle>
				</g>
		</svg>
	<p>MORE</p>

<script src="__PUBLIC__/static/index/js/lazyload.min.js"></script>
<script type="text/javascript">
$(function () {
	var more = true;
	var ajaxLoad = true;
	var btn_more = $(".promore");
	var href = "";      
	var dompage = $(".page ul li.next");
	if(dompage.length==1 && more){
		$(window).scroll(function () {
		  var totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop());
		  if (($(document).height() - 500) <= totalheight && ajaxLoad) {
			   Page();
		  }
		});
	}
	function Page() {
	  ajaxLoad = false;
	  var href = "";      
	  var dompage = $(".page ul li.next");
	  if(dompage.length==0){return false;}
	  href = dompage.find("a").attr("href");
	  $.ajax({
		type: "get",
		url:href,
		beforeSend: function () {	btn_more.show();},
		success: function (dat) {
		  var ajaxDom = $(dat).find(".caselist");
		  var pagehtml = $(dat).find(".page");
		  if (ajaxDom.html() && ajaxDom.html().trim().length > 0) {
			$(".caselist").append(ajaxDom.html());
			$(".page").html(pagehtml);
			$('img.lazyload').lazyload({
			  threshold: 200,
			  effect: 'fadeIn'
			});
			btn_more.hide();
			ajaxLoad = true;
		  }else{
			more = false;
		  }
		}
	  });				
	}
})
</script>ipt>