7

より多くの投稿をロードする前にクリックするボタンを持つ無限スクロールプラグインはどこで入手できますか？

これが私が探しているものです（右下隅にあるその他のボタンを見てください）

質問のスクリーンショットの例

4

5 に答える 5

8

jQuery無限スクロールプラグインのドキュメントページから：

1.4では、コンテンツの次のページの読み込みを自由にトリガーできます。まず、デフォルトの動作のバインドを解除します。そして、いつでも次のプルをトリガーします。

// unbind normal behavior. needs to occur after normal infinite scroll setup.
$(window).unbind('.infscr');
// call this whenever you want to retrieve the next page of content
// likely this would go in a click handler of some sort
$(document).trigger('retrieve.infscr');

それはあなたの問題を解決するはずです。

于 2012-01-07T14:08:31.303 に答える
2

Infinite Scroll Plugin (2.1.0) の現在のバージョンでは、要素がロードされたときに一時停止して再開し、ボタンのクリック (またはその他) で新しいコンテンツをロードする必要があるかどうかを確認できます。

$('.container').infinitescroll({
        // infinite scroll options
    },
    function(){
        // pause when new elements are loaded
        $('.container').infinitescroll('pause')
    }
);

function resume_infinite_scroll(){
    // resume
    $('.container').infinitescroll('resume')
    // check if new elements should be loaded
    $('.container').infinitescroll('scroll')
}

その後

<button onclick="resume_infinite_scroll()">load more</button>
于 2015-09-03T17:11:02.220 に答える
1

無限スクロールを探している場合、それは 1 つのことですが、[その他] ボタンだけにプラグインは必要ありません。

HTML

<div id="items">
    <!-- Run your query using the page parameter to offset items, then display the items here -->
</div>
<button id="more">More</button>

JS

var page = 0;
$('#more').click(function(){
    page++;
    $('<div/>').appendTo('#items').load('the/same/url/?page='+page+' #items');
});

.load関数は、指定された URL への AJAX 呼び出しを行い、オプションのセレクターは特定の一致したアイテムを引き出すだけです。この場合、表示ページへの ?page パラメータがクエリへのオフセットを制御して必要なアイテムを取得する場合、URL を .loading すると、呼び出されるたびに次のアイテム セットが追加されます。

もちろん、次の項目セットの HTML フラグメントを返すだけの独自の AJAX ページを作成することもできますが、アーキテクチャによってはもう少し複雑になります。ただし、そうすることで帯域幅/実行時間を節約できます。

于 2012-01-07T14:27:04.870 に答える
0

基本的に、本体にはcssoverflow ：scrollが必要であり、moreボタンはjqueryappendを使用してコンテナDivにさらにhtmlを追加する必要があります-http ://api.jquery.com/append/

于 2012-01-07T14:09:26.990 に答える