我正在使用'无限滚动'脚本,即使没有更多的记录,该脚本也会继续向数据库发送请求。发生这种情况时,它将重新加载页面上的最后一组。我希望该功能在达到数据库上的最后一个记录时停止运行。我是JS的新手,所以我很难进行故障排除,而且我不使用jQuery。我在PHP脚本中做大部分工作。
我一直在这里阅读很多有关"无限滚动"的文章,但我无法获得其他人如何查看JS中的限制。
javascript
function loadPosts(){
var target = document.getElementById('PostsContainer');
var contentHeight = target.offsetHeight;
var yOffset = window.pageYOffset;
var y = yOffset + window.innerHeight;
if(y >= contentHeight){
var xhr = ajaxObj("POST", "loadContent.php");
xhr.onload = function(){
target.innerHTML += xhr.responseText;
}
xhr.send("action=loadMore");
}
}
window.onscroll = loadPosts;
php
$sql = "SELECT * FROM posts WHERE post_type = 'a' ORDER BY post_date DESC LIMIT 2" //Original content on page
$totalPosts = 12; (query to DB)
$max = 1;
$current = 2; //Start on record after initial content
while($current < $totalPosts){
$sql = "SELECT * FROM posts WHERE post_type = 'a' ORDER BY post_date DESC
LIMIT $current, $max";
$result = $db_link->query($sql);
$posts_list += ... //Collect the data from DB
$current++;
}
echo $posts_list;
即使我在DB中没有记录之后,我不断滚动新内容仍在继续加载。输出每次我到达页面底部时都会不断重复。在这种情况下,我在DB中有7个帖子,我从7、6开始...然后我继续获得5-1的帖子。
,在这种情况下,您可以做什么,只需在JSON中添加一个参数,从php
或server side
中添加一个将说明的数据,是否存在数据,您可以基于此添加数据,您可以停止调用loadPosts
函数
因此,基本上是算法,
... PHP
while($current < $totalPosts){
......................
......................
if($current >= $totalPosts)
{
$getNext = False;
}
else
{
$getNext = True;
}
}
... Javasrcipt
function loadPosts(){
if(!getNext)
return false;
else
{
......................
......................
}
}
window.onscroll = loadPosts;
希望此策略能帮助您