3

我的页面上有 2 个选项卡，每个选项卡都有针对不同内容的无限滚动。切换选项卡时，会像这样调用函数：

function callInfScroll(newlink){
var $container = '#main';
$('#page-nav').find('a').attr('href',newlink);
$container.load(newlink, function(){
  $container.infinitescroll({
    loading: {
        finishedMsg: "This is it"
    },

    navSelector  : '#page-nav',
           // selector for the paged navigation 
    nextSelector : '#page-nav a',
                   // selector for the NEXT link (to page 2)
    itemSelector : '.item',
                   // selector for all items you'll retrieve
    errorCallback: function(){
        $('#page-nav').html("Congratulations! You have reached the end of internet.");
        $('#page-nav').css({display: 'block'});
    }
  });

});
}

问题是，即使 的值在#page-nav a变化，这种变化并没有反映在无限滚动中，它仍然从第一个选项卡中获取旧值。

编辑：我的 HTML：

    <div id="main-container" class="span8">
        <div id="main">
        </div>
        <div id="page-nav">
            <a href=""></a>
        </div>    

    </div>
4

2 回答 2

2

我知道你已经很久没有遇到这个问题了。但是我今天遇到了同样的问题，花了一段时间才通过它。但我终于做到了。

该插件将路径和当前页面存储在某个变量中......因此，如果您更改 page_nav href 并不重要。

因此，您不仅需要更改 url，还需要更改插件存储的变量。

首先，您需要了解无限滚动将您的 URL 分成两部分，即 URL 和 NEXT PAGE NUMBER。

将其视为您的 page_nav。

<div id="page_nav" style="display: none;">
    <a href="http://localhost/trunx/blog/page/all/4">Próxima Página »</a>
</div>

在这种情况下，插件将我的 URL 存储到opts.path[0]

http://localhost/trunx/blog/page/all/

并将当前页面存储到opts.state.currPage

假设您的新网址如下：

http://localhost/trunx/blog/page/programing/1

您可以看到，在这个新 URL 中，我将类别从全部更改为编程，并将页面从4更改为1

我所做的是：

var newPath = 'http://localhost/trunx/blog/page/programing/';
var newPage = 1;

// Changes the page_nav href.
$('#page_nav a').attr('href', newPath+newPage);

// Changes the plugin's stored variables
$('.postsBlog').infinitescroll({path:[newPath,''],state: {currPage:newPage-1}});

// This resets the pagination binder so if you had reached the end,it will now start paginating again.
$('.postsBlog').infinitescroll('bind');

考虑到.postsBlog是应用了我的 infiniteScroll 的容器。

您可以看到，当我设置新的 currPage 时，我从中减去 1。那是因为Infinity Scroll在设置下一页时会自动求和1。

于 2013-12-17T20:43:27.087 回答
0

没有页面来试验很难说，但是......

除非您从第一个选项卡中删除内容，否则看起来您最终会在页面上使用相同 id (" #page-nav") 的多个元素，这在 CSS 中是非法的。您可能会发现 jQuery 只是返回第一个。您可能会考虑使用基于类的解决方案而不是 id。

于 2013-03-15T08:30:58.270 回答