5

jQueryアイソトープで無限スクロールプラグイン（infinite-scroll）を使用していますが、ユーザーがページを下にスクロールしてより多くのアイテムを表示するときに、カスタムクエリパラメーターでパスを変更できるかどうか疑問に思っていました.

パスにアクセスしてクエリ パラメータの 1 つを変更する方法はありますか。最初のアイテムのセットを返すパスに初めてヒットし、その後、次のページ 1,2 3 にヒットしますが、最初に使用したのと同じクエリパラメーターを使用して、ページ番号のみを更新します。

次のようなものでページ 3 または 4 をヒットするときに、パラメーターの 1 つを変更したいと思います。

var customPath = path + "?type=items&category=clothes&pageNumber=";

私はこれに間違った方法でアプローチしていますか?

これが私のコードです：

$container.infinitescroll({
    navSelector: '#page_nav', // selector for the paged navigation 
    nextSelector: '#page_nav a', // selector for the NEXT link (to page 2)
    itemSelector: '.element', // selector for all items you'll retrieve
    loading: {
        finishedMsg: 'No more categories to load.',
        msgText: "<em>Loading the next set of categories...</em>",
        img: 'http://i.imgur.com/qkKy8.gif'
    },
    pathParse: function (path, nextPage) {
        var customPath = path + "?type=items&category=all&pageNumber=";
        path = [customPath, '#contaner'];
        return path;
    }
},
// call Isotope as a callback
function (newElements) {
    $container.isotope('appended', $(newElements));
});
4

1 に答える 1

7

さて、私は少しハックをしなければなりませんでしたが、関連する質問を私に指摘してくれたリッチのおかげで、私のニーズに合わせてそれを機能させることができました。

ここで、jquery.infinitescroll.jsプロトタイプにいくつかの追加プロパティを追加しました。

//line 67
 $.infinitescroll.prototype = {
       //My custom parameters
        pageType: "&type=items",
        categoryParam: "&category=shoes",
        /*  
            ----------------------------
            Private methods
            ----------------------------
            */

次に、呼び出される関数の内部：

retrieve: function infscr_retrieve(pageNum) {}

変数があります：

desturl = path.join(opts.state.currPage)

に変更しました

desturl = path.join(opts.state.currPage + $.infinitescroll.prototype.pageType + $.infinitescroll.prototype.categoryParam);

これにより、desturlの最後に追加のクエリパラメータが追加されます。

次に、JavaScriptを使用しているページから、次のような操作を実行できます。

$('#filters a').click(function () {
    $.infinitescroll.prototype.pageType = "&type=products" ;                  
    $.infinitescroll.prototype.pageType = "&category=clothes";                           
     return false;
});

これにより、カスタムクエリで次のページのクエリパラメータが更新されます。

これが誰かを助けることを願っています。

于 2012-09-17T22:11:21.747 に答える