0
$(function() {
  $(window).scroll(function(){
     checkY();
    });
 $('.post').last().after('<div class="newPost" />');
    var hrefArray = [],//array global
    hrefs = $('.paging a[href*="/t"]').not('.paging a[href*="/t"] > img');
 for(var i=0;i<hrefs.length;i++) {
     var hreflink = $(hrefs[i]).attr('href');
     hrefArray.push(hreflink);
     }
    hrefArray.pop();
    var postedLast = $('.post').last().position().top + $('.post').last().outerHeight();

function checkY(){
if(hrefArray.length > 1) {
   if( $(window).scrollTop() > postedLast){
         var url = hrefArray.shift();
           $('.newPost').html('<img  class="loadingImg" src="http://i79.servimg.com/u/f79/17/83/35/07/loadin10.gif"/>');
setTimeout(function() {
     $('.loadingImg').remove();
     $('.newPost').last().load(url+" .post",function() {
     //THIS LINE BELOW IS THE PROBLEM
     $('.newPost').last().after('<div class="newPost" />');
     postedLast = $('.post').last().position().top +
                  $('.post').last().outerHeight();
  });
 },3000);
  } 
 }
}
     window.onLoad = checkY();
 });

上面的代码是无限滚动的模拟。我的问题是它一遍又一遍地附加该行。有没有办法让它只附加一次?我已经为此尝试了几乎所有东西,但它只是没有像以前那样工作。还有没有办法代替这样做

 $('.post').last().position().top + $('.post').last().outerHeight();

因为它似乎不想及时加载。我想做到这一点,一旦元素位于屏幕底部,它就会发挥作用。这是因为这个 -if( $(window).scrollTop() > postedLast){还有另一种方法可以做到这一点吗?因此,它不是在屏幕顶部,而是在屏幕底部起作用?(最后明显)

4

1 回答 1

0

看一下这个:

http://www.jquery4u.com/tutorials/jquery-infinite-scrolling-demos/

我认为您可能可以利用一些优秀的开源插件,这些插件已经完成了您正在尝试做的事情,而无需重新发明轮子,或者您可以使用他们第二个示例中的这个片段(我发现它很简单,但很有效),我就是在这里复制粘贴:

<script type="text/javascript">
$(window).scroll(function()
{
    if($(window).scrollTop() == $(document).height() - $(window).height())
    {
        $('div#loadmoreajaxloader').show();
        $.ajax({
        url: "loadmore.php",
        success: function(html)
        {
            if(html)
            {
                $("#postswrapper").append(html);
                $('div#loadmoreajaxloader').hide();
            }else
            {
                $('div#loadmoreajaxloader').html('<center>No more posts to show.</center>');
            }
        }
        });
    }
});
</script>
于 2013-06-01T05:55:10.330 回答