InfiniteScroll不适用于弹出窗口

Question

我在我的页面上有链接，其中显示了与此html的全屏弹出窗口：

<div class="movie-popup-container">
     <div class="popup">
          <-- content of popup --!>
     </div>
</div>

我的infinitescroll(由Paul Irish编写)如下：

$('#activity').infinitescroll({
    behavior: 'local',
    binder: $('.movie-popup-container'),
    bufferPx: 100,
    loading: {
        finishedMsg: "This is the end!",
        img: "/images/loading2.gif?ver=1",
        msgText: "Loading ...",
        speed: "slow",
        selector: "#movie-activity-container #loading-status"
    },
    debug: true,
    navSelector: navSelectorNew,
    // selector for the paged navigation (it will be hidden)
    nextSelector: nextSelectorNew,
    // selector for the NEXT link (to page 2)
    itemSelector: ".movie-activity-feed"
    // selector for all items you'll retrieve
});

我已经将插件配置为仅用于弹出式滚动，而不是窗口滚动。它只适用于某些弹出窗口，而不适用于其他弹出窗口，并且没有模式。它可以处理之前不能处理的弹出窗口，反之亦然。从内容上讲，所有弹出窗口都有相同的数据。调试日志如下：

//1st popup

XHR finished loading: "http://example.com/GetMain.jsp?productId=6219a937-6d9c-4d42-81b6-85380c306732". jquery.min.js:2
XHR finished loading: "http://example.com/GetXYZ.jsp?cache=0&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=2". jquery.min.js:2
["determinePath", Array[2]]
 plugins.js:51
["Binding", "bind"] plugins.js:51
["math:", 2813, 2728] plugins.js:51
["heading into ajax", "/GetXYZ.jsp?cache=1&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=2"] plugins.js:51
Using HTML via .load() method plugins.js:51
XHR finished loading: "http://example.com/GetXYZ.jsp?cache=1&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=2". jquery.min.js:2
["contentSelector", div#movie-activity]
 plugins.js:51
["math:", 2613, 2728] plugins.js:51
["heading into ajax", "/GetXYZ.jsp?cache=1&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=3"] plugins.js:51
Using HTML via .load() method plugins.js:51
XHR finished loading: "http://example.com/GetXYZ.jsp?cache=1&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=3". jquery.min.js:2
["contentSelector", div#movie-activity]
 plugins.js:51
["math:", 1973, 2728] plugins.js:51
["heading into ajax", "/GetXYZ.jsp?cache=1&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=4"] plugins.js:51
Using HTML via .load() method plugins.js:51
XHR finished loading: "http://example.com/GetXYZ.jsp?cache=1&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=4". jquery.min.js:2
["contentSelector", div#movie-activity]
 plugins.js:51
["math:", 1173, 2728] plugins.js:51
["heading into ajax", "/GetXYZ.jsp?cache=1&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=5"] plugins.js:51
Using HTML via .load() method plugins.js:51
XHR finished loading: "http://example.com/GetXYZ.jsp?cache=1&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=5". jquery.min.js:2
["Error", "end"] plugins.js:51
["Binding", "unbind"] plugins.js:51
//1st popup closed with successful scrolling

//2nd popup 
XHR finished loading: "http://example.com/GetMain.jsp?productId=6219a937-6d9c-4d42-81b6-85380c306732". jquery.min.js:2
XHR finished loading: "http://example.com/GetXYZ.jsp?cache=0&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=2". jquery.min.js:2
["determinePath", Array[2]]
 plugins.js:51
["Binding", "bind"] plugins.js:51
["math:", 3113, 2728] plugins.js:51
["math:", 2813, 2728] plugins.js:51
["heading into ajax", "/GetXYZ.jsp?cache=1&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=2"] plugins.js:51
Using HTML via .load() method plugins.js:51
XHR finished loading: "http://example.com/GetXYZ.jsp?cache=1&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=2". jquery.min.js:2
["contentSelector", div#movie-activity]
 plugins.js:51
["math:", 1984, 2728] plugins.js:51
["heading into ajax", "/GetXYZ.jsp?cache=1&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=3"] plugins.js:51
Using HTML via .load() method plugins.js:51
XHR finished loading: "http://example.com/GetXYZ.jsp?cache=1&type=all&productId=6219a937-6d9c-4d42-81b6-85380c306732&page=3". jquery.min.js:2
["contentSelector", div#movie-activity]
 plugins.js:51
//2nd popup closed with successful scrolling

//3rd popup
XHR finished loading: "http://example.com/GetMain.jsp?productId=cf352423-0b05-4fa2-9ca8-323842bc96c2". jquery.min.js:2
XHR finished loading: "http://example.com/GetXYZ.jsp?cache=0&type=all&productId=cf352423-0b05-4fa2-9ca8-323842bc96c2&page=2". jquery.min.js:2
["determinePath", Array[2]]
 plugins.js:51
["Binding", "bind"] plugins.js:51
["math:", 3113, 2308] plugins.js:51
["math:", 2913, 2308] plugins.js:51
["math:", 2613, 2308] plugins.js:51
["math:", 2464, 2308]
//3rd popup scrolling failed despite going till bottom. 

对于上面日志中的第三个弹出窗口，我滚动到底部，它只是在debug中一直显示数学行。另外，你能告诉我“数学：”，3113,2308这行代表什么吗？

Answer 1

由于您还没有提供可以测试的示例，因此我将基于以下几个假设来回答这个问题：

1. 您正在为弹出窗口使用插件或自写脚本
2. 必须初始化一次弹出脚本，链接才能在click event

上打开弹出窗口

如果我的假设是正确的，那么这个问题是由于弹出窗口的初始化造成的。一旦infinitescroll脚本运行，你应该再次运行你的脚本。你可以在回调中做到这一点。

$(elem).infinitescroll(options,[callback for reinitalization of popups]);

Answer 2

数学表示：

this._debug('math:', pixelsFromWindowBottomToBottom, opts.pixelsFromNavToBottom);

// if distance remaining in the scroll (including buffer) is less than the orignal nav to bottom....
return (pixelsFromWindowBottomToBottom - opts.bufferPx < opts.pixelsFromNavToBottom);

请参阅https://github.com/paulirish/infinite-scroll/blob/master/jquery.infinitescroll.js

2464-40 < 2308 =假

它应该调用this.retrieve()

//我看到您将bufferPx设置为100，它仍然应该解析为false

2464-100 < 2308 =假

将不得不进一步研究它...