引入:template.js
请求数据方法:
<script type="text/javascript"> $(function() { /*瀑布流*/ var page = 2; var loading = false; $(window).scroll(function() { if ($(document).height() - $(this).scrollTop() - $(this).height() < 100) { loadMore(); } }); function loadMore() { if (loading === false) { loading = true; $(".loadmore").show(); $.get("/pc_ajax_data", {catid: {$catid}, page: page}, function(list) { if (list.status) { page++; $("#J_load_content").append(template("storyTemplate", {list: list.data})); loading = false; $(".loadmore").css('display', 'none !important'); } else { $(".loadmore").text("没有更多了"); } }, 'json'); } else { return; } } }); </script>
遍历数据:
<script id='storyTemplate' type="text/html"> {{each list as value key}} <li><a href="{{value.url}}" title="{{value.title}}"><img width="289" height="{{value.height}}" src="{{value.thumb}}" alt="{{value.title}}"> <h5>{{value.title}}</h5> <p>{{value.subtitle}}</p> <span class="ico-detail"><i class="uzicofont uzico-shipin1"></i></span> </a> </li> {{/each}} </script>