Question

我正在处理一个脚本，当您触发内容时（通过单击链接）加载内容，或滚动到页面底部。我这样做是为了好玩，但它正在慢慢变成一场噩梦...... 触发的部分正常工作，而＃34;滚动到底部＆＃34;部分有时有效，有时不起作用。它有时会加载一个帖子两次，有时会重复帖子集（我一次只加载5个）而不显示下一组，我的猜测是因为它加载内容的速度很快， / p>

查询混淆了（AJAX调用/ mysql查询/响应......？）或......
DOM存在某种问题（我猜这是调用此方法的正确方法......）或......
由于我的基本知识，这是我目前无法想到的另一个小故障......

当你保持滚动条向下时会出现问题，因此它会非常快速地加载内容，这对Firefox来说尤其有问题，因为如果你已经在底部并刷新页面，它将无限期地加载，直到那里没有更多的帖子，而且它确实很快。

我一整天尝试了不同的方法......我无法找到解决方案。首先，我尝试设置一个标志，这样当每个AJAX调用完成时，它会根据加载的帖子数增加某个变量，并且只有在数量增加后才会再次执行调用，并且必须按顺序执行（在我脑海里意味着成功的AJAX电话）。这没用。

然后我尝试为AJAX调用设置超时，然后为包含该调用的函数设置，然后对于首先执行该函数的函数（滚动到底部），这种工作，但缺点是它没有为超时做任何事情（因此，甚至没有显示＆＃34;加载＆＃34; html）并且情况发生的次数更少，但仍然在发生。我也尝试在$ .ajax（）函数中设置超时，我认为这是一种不同的超时，因为它没有做我想要的...

最后，我尝试使async为false，我读到这是一件坏事，因为它会挂起页面直到它完成，因为它也被弃用了;不用说，它也没有用（我没有注意到行为的任何明显变化）。

我真的迷失在这里;我甚至都不确定为什么会出现这种＆＃34;故障＆＃34;发生......

这是我的代码......

    $.ajax({    //Removed some code in order to make it brief                             
  url: 'load.php',        
  type: 'post',     
  dataType: 'json',       
  data: {offset: countContent, limit: displayNumber},
  success: function(data)         
  {
           if(data)
           {
            for(var i=0;i<display_n;i++)
                     {
            var title = data[i][1];
            var author = data[i][2];
            var img = data[i][3];
            var date = data[i][4];
            var htmlStr = 
            '<div class="post" id="'+i+'"></div>';
           $(element).append(htmlStr);
           $(element).children('#'+i+':last').hide().fadeIn(200+(i*250));
                      }
            }
           else if(data == null){

             //Do something when there are no more posts
          }

  },
  error: function() { 
         // Error     
                     }

});

处理ajax调用的php

<?php
$offset = (int) $_POST['offset'];
$limit = (int) $_POST['limit'];
$db = 'mysql:host=localhost;dbname=posts;charset=utf8';
$u = 'username';
$p = 'password';
$con = new PDO($db,$u,$p);
$q = $con->prepare("SELECT id, title, author, img, date FROM articles 
ORDER BY id DESC LIMIT :limit OFFSET :offset");
$q->bindParam(':offset',$offset,PDO::PARAM_INT);
$q->bindParam(':limit',$limit,PDO::PARAM_INT);
$q->execute();
$articles = $q->fetchAll(PDO::FETCH_NUM);
$con = null;
$array_count = count($articles);
if ($articles){
 for ($i=0;$i<$array_count;$i++)
   {
$articles[$i][4] = date("d F Y",strtotime($articles[$i]['4'])); 
  }
   echo json_encode($articles);
  }
 else
 {
  $articles = null; //sends null if the data is empty
 echo json_encode($articles);
 }
?>

有没有办法延迟＆＃34;在另一个执行之前调用ajax，以便正确加载文章？或者等到ajax中的所有内容按照计划加载到下一个之前？在这种情况下我该怎么办？

对不起，如果这篇文章有点大，我想我想说明一点，哈。非常感谢帮助，谢谢。

编辑：以下是我发布的内容及解决方案：

我将全局变量运行设置为false，并包装整个AJAX 在if ！运行条件内调用，立即制作变量进入循环后返回true，并在其中任何一个上再次为false ＆＃34; 完成：＆＃34; $ .ajax函数的参数或通过 $ .ajaxComplete（）。我猜测一个人也可以使用 .on（）和.off（）语句来绑定和取消绑定事件触发器，但我发现以前的方法更加简单。

这允许AJAX调用在另一个调用开始之前完成，并且内容显示正确。

Answer 1

我建议您在触发事件后立即关闭事件触发器，并在填充DOM后重新启用它。

加载“无限”滚动的AJAX数据不正确

1 个答案: