如何在2个标签上调用无限滚动

Question

所以我的页面上有一些标签：

<ul class="nav nav-tabs" role="tablist">
    <li role="presentation" class="active"><a href="#" aria-controls="menuSelection" role="tab" data-toggle="tab" id="newTopicLink">New</a></li>
    <li role="presentation"><a href="#" aria-controls="menuSelection" role="tab" data-toggle="tab" id="popularTopicLink">Popular</a></li>
</ul>

我在页面上有无限的滚动设置：

$(window).scroll(function(){
    if($(window).scrollTop() == $(document).height() - $(window).height()){
        infiniteScrollData();
    }
});

我的问题是...是否可以在每个选项卡上使用无限滚动？是否可以将其仅绑定到选项卡而不是整个页面？这样，当我单击某个选项卡时，它将拉出其自己的数据并允许对该选项卡进行无限滚动，还是我应该使用其自身的数据创建另一个页面并滚动，并将其链接到该选项卡？

与此类似：