2012-09-17 18 views
5

jQueryアイソトープで無限のスクロールプラグイン(infinite-scroll)を使用していて、ユーザーがページをスクロールしてさらに項目を表示すると、カスタムクエリパラメータでパスを変更できるかどうか疑問でした。Infinite scrollプラグインがカスタムクエリでパスを変更する

パスにアクセスしてクエリパラメータの1つを変更する方法はありますか。 最初の項目を返すのはOKですが、その後は次のページ1,2,3 okになりますが、最初にページ番号を更新するのと同じクエリパラメータを使用しています。

私はこのようなもので、3ページまたは4を打つときのパラメータのいずれかを変更したいと思います:

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)); 
}); 
+0

あなたのcustomPathは不正なjs構文です。あなたはそのような二重引用符の中に "靴"を持つことはできません。二重引用符を削除しても問題ありません。 ( '&category = shoes&')私はあなたが理解するのに十分な情報を与えたとは思わない。ユーザーがページ3に達したときにカテゴリを「服」から「靴」に変更したいとお考えですか?それはあなたが靴のページ3とは対照的に、衣服の3ページにとどまりたいということですか?あなたは何をしようとしているのですか? – Ringo

+0

申し訳ありませんが私の側で私は引用符を削除した間違いフォームだった。最初にユーザーがページを見るときに、異なるカテゴリからのページ上に30項目があります。今、ページ上にボタンがあり、ユーザーがそれをクリックすると、その項目はフィルタリングされ、カテゴリーの服のもののみが表示されます。ユーザーが下にスクロールすると、次の30個のアイテムを取得する必要がありますが、すべてのアイテムを取得するのではなく、カテゴリの服のアイテムのみを取得するように、パスのクエリを変更する必要があります。 –

+1

私は無限スクロールについては十分には分かっていませんが、ここでは回答が得策です。 http:// stackoverflow。com/questions/11397648/infinite-scroll-pathparse-for-reverse-wordpress-comments – Ringo

答えて

7

[OK]をので、私は少しハックをしなければならなかったが、私はそれは私のニーズに合わせて、関連の質問に私を指しているのリッチのおかげで作業しました。

私はここ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; 
}); 

これはカスタムクエリで、次のページのクエリパラメータを更新します。

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

関連する問題