infinite无法持续加载更多数据

老师，还是之前那个infinite不触发的问题，现在发现当加载的数据条数超过一定之后，infinite函数就不触发了。（老师给的sql一共是7条数据，我把他复制了下，数据库一共14条数据，复制的数据在名称前会有个2字以示区分,uid是一样的，但是这里应该没影响）

数据库截图如下：

模板里的infinite代码如下：

当我设置每页6条数据后

会发现页面是调过1次infinite函数的，页面当前显示的是7条原始数据和5条复制数据，还有2条数据未显示，但是当加载完一次更多数据后，再往下往上尝试更多次加载更多时，已经不会再触发infinite函数，更明显的是，当我把分页数据写成10条时，infinite函数就一次也不会执行了。

​

我感觉下来，问题就是当数据页面稍微多一点的时候，infinite函数就失灵了。想问下老师的程序里，如果当数据足够多的时候，比如数据库有100条数据，每页10条，能把数据一页一页全部加载完吗？

以下是我该页面的js代码：

<script>
var page=1;
{#var noMore = false;#}
    var loading = false;  //状态标记
    var list = $('#mall_list');
function loadData(page_tmp, finishCallBack){
$.ajax({
url:"{% url 'mall:product_load_list' %}",
data:{
page:page_tmp
            },
success:function (rs) {
{#alert(rs);#}
                if (finishCallBack){
                    finishCallBack(rs);
                }
            }
        });
    }
$(document.body).pullToRefresh().on("pull-to-refresh", function() {
headRefresh();
    });
$(document.body).infinite(200).on("infinite", function() {
console.log(11111);
footerRefresh();
    });
function headRefresh(){
if(loading) return;
loading = true;
loadData(1, function (rs) {
$(document.body).pullToRefreshDone();
loading = false;
page = 1;
list.empty();
list.append(rs);
        });
    }
function footerRefresh(){
{#if(loading || noMore) return;#}
        if(loading) return;
loading = true;
page_tmp = page + 1;
loadData(page_tmp, function (rs) {
loading=false;
page = page_tmp;
list.append(rs);
        });
    }
$(function () {
headRefresh();
    });
</script>