使用jquery-mobile无限滚动

Question

我在我的网站上使用无限滚动，我想在我的移动网站上使用相同的滚动，然而，一旦我包含jquery- mobile，它就停止工作。

没有这一点，它工作得很好。有什么建议吗？

详细信息:我使用的是保罗爱尔兰的无限滚动。初始化似乎不会产生任何错误，但同时，它不会加载下一个页面(当我到达页面底部时，不会进行ajax调用)。

我已经建立了一个裸骨网站here

Answer 1

我知道为时已晚，但迟到总比不到好。

您可以使用以下setInfifniteScroll()函数在页面上设置无限滚动。您可以调用此函数或直接在文档就绪函数中复制函数代码

$(document).ready(function(){
    setInfifniteScroll(scrollingDivId); // Here instead of scrollingDivId you can pass window object
});

Paulirish无限滚动js有一些预定义的算法来计算下一个页面的url，如果你的url与它不匹配，那么它就不会调用下一个页面。因此，我修改了url来调用下一页。

在这里你加载你的第一页的内容，然后无限滚动将从第二页开始工作。请注意，您已经为每个页面维护了一个特定路径。下面给出的示例将?page=pageNumber附加到我的url。

function setInfifniteScroll(scrollingDivId){
    $('#scrollingDivId').infinitescroll({
        state: {
           currPage: 2 ,
           isDestroyed: false,
           isDone: false     
       },  
       loading: {
          finishedMsg: "<em>No more content to load. You have reached to end.</em>",
          img: "image/loader.gif",
          speed: 'fast',
          msgText: "<em>Loading the next set of content...</em>",
          delay  : 1
       },
       navSelector      : "#navId",
       nextSelector     : "#navId a",
       itemSelector     : ".itemselector", // it is element class to catch from your response
       debug            : false,
       dataType     : 'html',
       path: function(pageNumber) {
          var url = $("#navId a").attr("href");
          pageNumber = parseInt(url.substring(url.lastIndexOf("page=")+5, url.length)) + 1;
          $("#navId a").attr("href","nextPageUrl_append with?page=" + pageNumber);
          return url;
       },
    }, function(newElements, data, url){
       // You can perform operations on data
    });
}