如下所示：

var page = 1; var size = 6; var mark = 0; var url = "{pigcms{:U('Order/index', array('page'=>'d%'))}"; var commentTpl = '<div> <button data-oid="<order_id>">去评价</button> </div>'; var template = '<li> <a href="{Pigcms{:U('Store/shop', array("store_id"=>"<store_id>"))}"> <i></i> <span>{store_name}</span> <i></i> </a> <div data-node="item-order" data-oid="<order_id>" data-status="0"> <a href="{pigcms{:U('Order/status', array("order_id"=>"<order_id>"))}"> <div> <img src="{pic_info}"> </div> <div> <div> <p>{create_time}</p> <p>总价：￥{discount_price}</p> </div> <div> <div> {state}{comment_tpl}</div> </div> </div></a> </div> </li>'; var emptyTpl = '<div id="refund-widget-list"> <ul data-node="refundList"> <div> <figure></figure> <p>暂无订单</p> </div> </ul> </div>'; function getList() { if (mark) { return false; } mark = 1; var requestUrl = url.replace(/d%/, page); $("#page-loader").show(); $.get(requestUrl, function(json){ if (json.num > 0) { render(json.list); $("#page-loader").hide(); page = page + 1; } else if(json.num <= 0 && page == 1) { $(".order-list").html(emptyTpl); } if (json.num >= size) { mark = 0; } $("#page-loader").hide(); }, 'json'); } function render(data){ for (var i=0,item; item=data[i++];) { var html = template; if (item['comment_status'] == 0 && item['order_status'] == 1) { item['comment_tpl'] = commentTpl.replace(new RegExp('<order_id>', "gm"), item['order_id']); } else if(item['comment_status'] == 1 && item['order_status'] == 1){ item['comment_tpl'] = '<div><span>已评价</span></div>'; } else { item['comment_tpl'] = '<div><span></span></div>'; } switch (item['order_status']) { case '0': item['state'] = '订单失效';break case '1': item['state'] = '订单完成';break case '2': item['state'] = '商家未确认';break case '3': item['state'] = '商家已确认';break case '4': item['state'] = '已取餐';break case '5': item['state'] = '正在配送';break case '6': item['state'] = '退单';break case '7': item['state'] = '商家取消订单';break case '8': item['state'] = '配送员已接单';break } html = html.replace(new RegExp('<order_id>', "gm"), item['order_id']); html = html.replace(new RegExp('<store_id>', "gm"), item['store_id']); for (var key in item) { html = html.replace(new RegExp('{'+key+'}',"gm"), item[key]); } $(".order-list").append(html); } } getList(); function comment(e){ e = e || window.event; e.stopPropagation(); e.preventDefault(); var oid = $("button").attr("data-oid"); location.href = "{pigcms{:U('User/comment')}&order_id="+oid; } $(document).ready(function(){ var WindowHeight = $(document).height; $(window).scroll(function(){ var top = $(document).scrollTop(); var height = $(document).height() - $(window).height() - 10; if (top >= height) { getList(); } }); });

以上就是小编为大家带来的jQuery实现手机版页面翻页效果的简单实例全部内容了，希望大家多多支持查字典教程网~