Question

我无法解决脚本如何工作，以及我该怎么做才能改进它，缩小等等。我还想找到一种方法来追加按钮，这将停止功能（有点禁用自动加载内容按钮），你有什么想法吗？这是代码:(对我来说最重要的部分是理解代码）

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();
        }
});
} );

Answer 1

该脚本基本上将lastPostFunc()函数绑定到$(window).scroll()事件。它说如果用户向下滚动到屏幕的底部200px，JavaScript应该触发该功能。

所有函数都显示加载div，可能是模态或叠加，然后获取下一页数据：

/店铺/类别/实例/？斯壮= 1个＃produkt_lista
/店铺/类别/实例/？斯壮= 2个＃produkt_lista
/店铺/类别/实例/？斯壮= 3个＃produkt_lista

..等等。然后，它遍历与CSS类.produkt .opis匹配的所有节点，并使用$(this).css('display','none');隐藏它们。它应该只是使用$(this).hide();，但无论哪种方式都可以。

之后，它将cluetip插件绑定到具有类.jt的所有锚点，并传入一些不同的插件参数。我想是这样你就可以用鼠标悬停它们，光标附近会出现一些奇特的工具提示。

最后检查数据是否为空并隐藏paginator元素（不知道原因）并将新获取的HTML包装数据附加到#produkt_lista内的现有数据。

jQuery页面自动加载滚动脚本 - 需要解释

1 个答案: