重置无限滚动以显示通过AJAX检索到的新结果

Question

我有一个过滤器表单，它使用来自数据库的新过滤结果填充容器div（#results）。但更改过滤器后Infinite Ajax Scroll插件显示第二页第一次搜索的结果。在更改事件中，我需要完全重置旧结果并仅显示新结果。我尝试了很多解决方案，但都没有做完我知道methods这样做，但我不明白如何在我的代码中使用它们（查看注释）。

// Form select inputs: on change call the filter 
    $("select").on("change", function() { 
     setTimeout(function() { 
     ias.destroy(); 
     }, 1000); 
     ias.bind(); 
     filter(); 
    }); 

    // Filter: Ajax call that returns new results by a SQL query to the DB 
    var filter = function() { 
     var formData = form.serializeObject(); 
     $.ajax({ 
     url: "/libs/filterData.php", 
     type: "POST", 
     data: JSON.stringify(formData), 
     cache: false, 
     success: function(results) { 
      $("#results").html(results); 
     } 
     }); 
    }; 

    // IAS configuration 
    //var initializeIas = function() { 
     var ias = jQuery.ias({ 
     container: "#results", 
     item: ".result", 
     pagination: ".page-nav", 
     next: ".page-nav a" 
     }); 
    //}; 

//initializeIas(); 

也试过this solution但不起作用。

类似的问题here。

Answer 1

尝试重新初始化更迭处理程序中IAS：

// Filter: Ajax call that returns new results by a SQL query to the DB 
var filter = function() { 
    var formData = form.serializeObject(); 
    $.ajax({ 
    url: "/libs/filterData.php", 
    type: "POST", 
    data: JSON.stringify(formData), 
    cache: false, 
    success: function(results) { 
     ias.destroy(); 
     $("#results").html(results); 
     ias.bind(); 
    } 
    }); 
}; 

// IAS configuration 
var ias = jQuery.ias({ 
     container: "#results", 
     item: ".result", 
     pagination: ".page-nav", 
     next: ".page-nav a" 
    });