在ajax加载页面内无限滚动

问题描述：

我有一个页面（让我们叫它1.php），它使用jQuery-ajax将2.php加载到div-box中。 2.php从我的数据库打印20条记录。当我滚动时到达div-box的底部时，我希望它加载下20条记录。像Facebook，Twitter等，等等。在ajax加载页面内无限滚动

现在，我已经得到了这种行为，但只有当它自己加载2.php时！但不在分隔框内。

我该如何解决这个问题？

在此先感谢！

答

文件1.PHP应该输出这样的：

<div id="content"> 
</div> 

<script type="text/javascript"> 
    $(document).ready(function() { 
    // when we scroll, check the position: 
    $(window).scroll(function() 
    { 
     // if at bottom, add new content: 
     if ($(window).scrollTop() == $(document).height() - $(window).height()) 
     { 
     $.get("2.php",function(data) { 
      $("#content").append(data); 
     },'html'); 
     } 

    }); 

    }); 
</script>

如果你想发送的迭代次数，以2.PHP你能记得它在一些隐藏的输入并把它作为参数传递给$获得（）。

希望它有帮助。

答

您可能在2.php中有一些初始化Javascript代码来设置滚动事件处理程序。当您使用ajax加载页面并将其放入div内时，此初始化代码不会执行。处理Ajax请求后，您需要执行相同的初始化代码。

我怎么会去吗？ :)顺便谢谢！ – Eax 2011-05-28 22:52:11

看看这个答案：http://stackoverflow.com/questions/235967/calling-a-jquery-function-inside-html-return-from-an-ajax-call – GolezTrol 2011-05-28 22:56:38

我感谢你的亲切先生！ – Eax 2011-05-28 22:57:47

答

这里的关键是检测滚动位置。这是否正常工作？

嗯，它在我自己加载2.php时起作用，如果这是你的意思？ :) – Eax 2011-05-28 22:53:21

答

考虑使用航点的jQuery插件： http://imakewebthings.github.com/jquery-waypoints/

并给予看看无限滚动例如： http://imakewebthings.github.com/jquery-waypoints/infinite-scroll/

在ajax加载页面内无限滚动

相关推荐