Infinite Scroll functions only in the front page

a 夏天 提交于 2020-01-23 03:45:10

问题


I'm using the infinite scroll plugin in a tumblr blog and everything works as it should, provided the user is in the front page- for example: "{someblog}.tumblr.com".

Starting from "{someblog}.tumblr.com/page/2" and so on, the plugin doesn't seem to load at all (it doesn't hide the navigation elements). initialize Here's the code I use to call it:

$('#container').infinitescroll({
loading: {
            finished: undefined,
            finishedMsg: "Finished",
            img: "preloader.gif",
            msg: null,
            msgText: "Loading...",
            selector: null,
            speed: 'fast',
            start: undefined
        },
         state: {
            isDuringAjax: false,
            isInvalidPage: false,
            isDestroyed: false,
            isDone: false, // For when it goes all the way through the archive.
            isPaused: false,
            currPage: 1
         },
        callback: undefined,
        debug: false,
        behavior: undefined,
        binder: $(window), // used to cache the selector
        nextSelector: "#next a",
        navSelector: ".navigation",
        contentSelector: "#container", // rename to pageFragment
        itemSelector: "div.post",
        animate: false,
        pathParse: undefined,
        dataType: 'html',
        appendCallback: true,
        bufferPx: 400
    },
...

edit: I enabled debug information and I got the following info:

({0:"Sorry, we couldn't parse your Next (Previous Posts) URL. Verify your the css selector points to the correct A tag. If you still get this error: yell, scream, and kindly ask for help at infinite-scroll.com."})

({0:"determinePath", 1:"/page/4"})

({0:"Binding", 1:"bind"}

It seems that it does find the address to the next page-"/page/4" (since I was on page 3). But it can't "parse" it for some reason?

Is it possible that the plugin can only function on page one, where the link to next page contains a "2"? If so, how can I override it?

Thanks a lot in advance!


回答1:


Thanks to @graygilmore I figured it out. This is the line that needs to be added to the code:

pathParse: function() {
    return ['http://{Name}.tumblr.com/page/', '']
},

Note that {Name} is a Tumblr variable and needs not be changed- Tumblr replaces it automatically.

Additionally- this line should be added in the state: {...} block:

currPage: {CurrentPage}

(Where as in the example in my question above I simply set it to "1").

{CurrentPage} is a Tumblr variable as well, so it's being replaced automatically with the current page number, for every page being viewed.

Now Infinite-Scroll loads properly on every page of the blog, which is especially useful when wanting to create a "load more posts" button, which gives the user a choice between regular (paged) navigation and infinite-scrolling.



来源:https://stackoverflow.com/questions/12026980/infinite-scroll-functions-only-in-the-front-page

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!