javascript - 滚动后如何加载ajax？

Question

我有多个 ajax 页面，我想在滚动后加载我的 ajax 页面，我该怎么做？我有一个简单的基本结构，我想在滚动后加载我的ajax，如无限滚动或惰性图像。

$('.lazy_content').on('load', function (e) {

            data_url = $(this).attr("data-url");
            data_id = $(this).attr("data-target-id");

            $.ajax({
                url: data_url,
                type: "POST",
                beforeSend: function () {
                    $(".loaderDiv").show();
                    $("#" + data_id).html("");
                },
                success: function (data) {
                    　$(data).each(function(index, el) {
	                    $(".loaderDiv").hide();
	                    $("#" + data_id).html(data);
               		});
                }

            })

        });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="lazy_content" data-url="/ajax/comments/aurum-didyma-spa-beach-resort" data-target-id="comments-content">
  <h4>COMMENTS</h4>
  <div id="comments-content" class="content-target"></div>
</div>

Answer 1

只需在元素(div)上添加事件滚动即可:

 $('.lazy_content').scroll(function() {
      data_url = $(this).attr("data-url");
      data_id = $(this).attr("data-target-id");

      $.ajax({
           url: data_url,
           type: "POST",
           beforeSend: function () {
                $(".loaderDiv").show();
                $("#" + data_id).html("");
           },
           success: function (data) {
                $(data).each(function(index, el) {
                     $(".loaderDiv").hide();
                     $("#" + data_id).html(data);
                });
           }
      })
 });