Устранение дубликатов записей

Question

Я использую следующий javascript для динамической загрузки содержимого внешней страницы на родительской странице. Внешняя страница находится в том же домене, что и родительская страница, и запрашивает базу данных для записей в блоге. Я использую переменную «eeOffset», чтобы передать значение в запрос базы данных на внешней странице, чтобы компенсировать результаты, возвращаемые, т.е. если eeOffset «5», тогда запрос возвращает следующие записи базы данных с 6-го. Переменная «eeLimit» задает общее количество элементов, возвращаемых с каждым запросом. Проблема заключается в том, что записи, отображаемые на родительской странице, дублируются - это похоже на то, что URL-адрес страницы шаблона не обновляется до запуска запроса на новые предметы. Есть ли у кого-нибудь предложения, как преодолеть эту проблему?

var eeLoading; // Declare variable "eeLoading" 
var eeTemplate = "http://www.mydomain.com/new_items/query"; // URL to template page 
var eeOffset; // Declare variable "eeOffset" 
var eeLimit = "5" 

//Execute the following functions when page loads 
$(function(){ 
    scrollAlert(); 
    $("#footer").append("<div id='status'></div>"); //Add some html to contain the status and loading indicators 
    updateStatus(); // Update the total number of items displayed 
    }); 

//Update Status 
function updateStatus(){ 
    var totalItems = $("ul.column li").length; 
    eeOffset = totalItems; 
    eeURL = eeTemplate+"/"+eeOffset+"/"+eeOrderby+"/"+eeSort+"/"+eeLimit+"/"; // Build the template page url 
    } 

//Scoll Alert 
function scrollAlert(){ 
    var scrollTop = $("#main").attr("scrollTop"); 
    var scrollHeight = $("#main").attr("scrollHeight"); 
    var windowHeight = $("#main").attr("clientHeight"); 
    if (scrollTop >= (scrollHeight-(windowHeight+scrollOffset)) && eeLoading !== "false"){ 
     $("#status").addClass("loading"); 
     $.get(eeURL, function(newitems){ //Fetch new items from the specified url 
      if (newitems != ""){ //If newitems exist... 
       $("ul.column").append(newitems); //...add them to the parent page 
       updateStatus(); //Update the status 
       } 
      else { 
       eeLoading = "false"; //If there are no new items... 
       $("#status").removeClass("loading"); //Remove the loading throbber 
       $("#status").addClass("finished"); //Add some text 
       } 
      }); 
     } 
    if (eeLoading !== "false") { //If there are still new items... 
     setTimeout("scrollAlert();", 1500); //..check the scollheight every 1500ms 
     } 
    } 

Answer 1

Похоже, в вашем коде есть состояние гонки. Если запрос на новые элементы длится более 1,5 секунд, вы можете отключить следующий запрос перед вызовом updateStatus(). Я думаю, что самый простой способ исправить это, чтобы переместить этот код:

if (eeLoading !== "false") { //If there are still new items... 
    setTimeout("scrollAlert();", 1500); //..check the scollheight every 1500ms 
    } 

Внутри если заявление, после UpdateStatus() вызов обновляет URL для запроса:

if (newitems != ""){ //If newitems exist... 
    $("ul.column").append(newitems); //...add them to the parent page 
    updateStatus(); //Update the status 
    // Move setTimeout here 

Таким образом, состояние будет всегда обновляться при запросе нового URL-адреса.