Jquery Ajax工具没有与Django Infinite Scroll一起运行

我在django中使用并实现了无限滚动，并加载页面

然而，我的Ajax调用只在第一页加载中起作用，在随后的延迟加载中不起作用。我必须使用$items。每个。。。。代码块

但是在使用了上面的方法之后，现在航路点不再加载页面，我被困在第一个页面本身（Ajax调用正在工作）。删除代码后，延迟加载可以加载后续页面。我将引导4与Django 3一起使用。有什么建议吗

我正在添加阻止延迟加载的脚本

<script src="{% static 'js/jquery.waypoints.min.js' %}"></script>
<script src="{% static 'js/infinite.min.js' %}"></script>
<script>
$(document).ready(function() {
    var infinite = new Waypoint.Infinite({
      element: $('.infinite-container')[0],
      onBeforePageLoad: function () {
        $('.loading').show();
      },
      onAfterPageLoad: function ($items) {
        $('.loading').hide();
        $items.each(function(){
            $(this).find('.like').on('click', likecommentevent);
        }
      }
    });
});
</script>

---

加载页面脚本和资源后需要调用代码

$(document).ready(function() {
  $(".infinite-container").waypoint(function(direction) {
    // your code
    if (direction === 'down') {
        losdMore();
    }
  }   
  function loadMore() {
    console.log("Loading page " );


    $.waypoints('refresh');
}    
});

---

加载页面脚本和资源后需要调用代码

$(document).ready(function() {
  $(".infinite-container").waypoint(function(direction) {
    // your code
    if (direction === 'down') {
        losdMore();
    }
  }   
  function loadMore() {
    console.log("Loading page " );


    $.waypoints('refresh');
}    
});

---

我终于解决了这个问题。调用似乎非常具体地针对$items，以便延迟加载工作。PFB工作方案供您参考：

<script src="{% static 'js/jquery.waypoints.min.js' %}"></script>
<script src="{% static 'js/infinite.min.js' %}"></script>
<script>
$(document).ready(function() {
    var infinite = new Waypoint.Infinite({
      element: $('.infinite-container')[0],
      onBeforePageLoad: function () {
        $('.loading').show();
      },
      onAfterPageLoad: function ($items) {
        $('.loading').hide();
        $items.find('.like').on('click', likecommentevent);
      }
    });
});
</script>

$（文档）.ready（函数（）{
var infinite=新航路点。无限({
元素：$（'.infinite container'）[0]，
onBeforePageLoad:函数（）{
$（'.loading'）.show（）；
},
onAfterPageLoad:函数（$items）{
$（'.loading'）.hide（）；
$items.find（'.like'）。在（'click'，likecommentevent'）上；
}
});
});

我终于解决了这个问题。调用似乎非常具体地针对$items，以便延迟加载工作。PFB工作方案供您参考：

<script src="{% static 'js/jquery.waypoints.min.js' %}"></script>
<script src="{% static 'js/infinite.min.js' %}"></script>
<script>
$(document).ready(function() {
    var infinite = new Waypoint.Infinite({
      element: $('.infinite-container')[0],
      onBeforePageLoad: function () {
        $('.loading').show();
      },
      onAfterPageLoad: function ($items) {
        $('.loading').hide();
        $items.find('.like').on('click', likecommentevent);
      }
    });
});
</script>

$（文档）.ready（函数（）{
var infinite=新航路点。无限({
元素：$（'.infinite container'）[0]，
onBeforePageLoad:函数（）{
$（'.loading'）.show（）；
},
onAfterPageLoad:函数（$items）{
$（'.loading'）.hide（）；
$items.find（'.like'）。在（'click'，likecommentevent'）上；
}
});
});

这样做了。但没有改变。您正在尝试使用库钩子。我试过了，但没做对。你能试试我上面的代码并表示它吗？是这样的。但没有改变。您正在尝试使用库钩子。我试过了，但没做对。你能试一下我上面的代码并表示它吗？过滤器代替了find，不起作用。你的get-post方法在无限滚动后在模板中工作吗？我对此有意见。每当我在基于类的视图中放入get post方法时，请在有限卷轴中使用。无限加载停止。有什么建议吗？@Rohan在使用infinite scroll时，您需要使用Ajax来获取和发布方法。@Rohan还使用$items来查找控件，如我的回答所示。由于它易于实现，但还添加了新的工作……Ajax StuffFilter代替了find，不起作用。您的获取和发布方法在无限滚动之后是否在模板中工作？我对此有意见。每当我在基于类的视图中放入get post方法时，请在有限卷轴中使用。无限加载停止。有什么建议吗？@Rohan在使用无限滚动时，您需要使用Ajax来获取和发布方法。@Rohan还使用$items来查找控件，如我的回答所示。因为它易于实现，但也添加了新的工作….Ajax Stuff