0

スクリプトが正確にどのように機能するか、およびそれを改善したり縮小したりするために何ができるかを理解するのに苦労しています。また、機能を停止するボタンを追加する方法を見つけたいと思います（コンテンツボタンの自動読み込みを無効にするようなものです） ）、何かわかりますか？コードは次のとおりです: (私にとって最も重要な部分は、コードを理解することです)

var page = 1;
var pageLast = 1;
var stop = false;
function lastPostFunc() 
{ 

    $('div#loading').html('loading data ...') ;
    page += 1;
    if (page+1 > pageLast) {
        stop=true;
    }
    var objURL = new Object();
    window.location.search.replace(
        new RegExp( "([^?=&]+)(=([^&]*))?", "g" ),
        function( $0, $1, $2, $3 ){
        objURL[ $1 ] = $3;
        }
        );
    q = '?strona='+page
    for (var k in objURL){
        if (k != 'strona' ) 
            q += ('&'+k+'='+objURL[ k ])
    }
    data = $('<div/>').load( "/shop/category/example/" + q +' #produkt_lista',function() {
        $('.produkt .opis',$(this)).each( function() { $(this).css('display', 'none'); } );
        $('a.jt').cluetip({ cluetipClass: 'jtip', arrows: true, dropShadow: false, hoverIntent: false, sticky: false, mouseOutClose: true, showTitle: false, closeText: 'zamknij', width: 300, positionBy: 'mouse', topOffset: 0});
    });
    if (data != "") {
        $('.paginator').hide();       
        $("#produkt_lista").append(data);            
    } 
    $('div#loading').empty();
}; 

$(document).ready(function() { 

pageLast = parseInt( $('.paginator .paginate-pages').first().text().replace('Stron: ',''));
$('#produkt_lista').after( $('<div id="wczytywanie" style="display: none; font-weight: bold; font-size: 20px; line-height: 40px; color: red; margin: 20px auto; width: 300px; border: 1px solid red;"></div>') );
$(window).scroll(function(){
        if  ($(window).scrollTop()+200 > $(document).height() - $(window).height()){
           if (!stop) lastPostFunc();
        }
});
} );
4

1 に答える 1

1

lastPostFunc()スクリプトは基本的にその関数を$(window).scroll()イベントにバインドします。ユーザーが画面の下部 200px までスクロールすると、JavaScript がその関数を起動する必要があります。

この関数が行うのは、ロード中の div (おそらくモーダルまたはオーバーレイ) を表示し、データの次のページを取得することだけです。

  • /shop/category/example/?strona=1#produkt_lista
  • /shop/category/example/?strona=2#produkt_lista
  • /shop/category/example/?strona=3#produkt_lista

..等々。次に、CSS クラスに一致するすべてのノードを繰り返し処理し、.produkt .opisを使用してそれらを非表示にし$(this).css('display','none');ます。を使用するだけですが$(this).hide();、どちらの方法でも機能します。

その後cluetip、クラスを使用してすべてのアンカーにプラグインをバインドし.jt、いくつかのさまざまなプラグイン パラメータを渡します。マウスでそれらをホバーすると、カーソルの近くに派手なツールチップが表示されるようになると思います。

最後に、データが空でないかどうかをチェックし、paginator 要素を非表示にし (理由はわかりません)、新しくフェッチされた HTML でラップされたデータを 内の既存のデータに追加します#produkt_lista。

于 2012-05-05T09:58:31.343 に答える