Ajaxコールを1回だけ作成するにはどうすればよいですか？

Question

ユーザーが画面の下にスクロールしたときに発生する次のコードがあります。唯一の問題は、Ajaxコールが1回だけ起動するようにしたいということです。私のコードは次のとおりです。

 var w = $(window); 
     window.onscroll = function(ev) { 
      if ($(document).height() - w.height() == w.scrollTop()) { 


       $('#loading-image').show(); 
       $.ajax({ 
        url: "page-2.html", 
        cache: false, 
        success: function(result){ 
         $("#part2").html(result); 
         console.log(); 
        }, 
        complete: function(){ 
         $('#loading-image').hide(); 
        } 
       }); 


      } 
     }; 

Answer 1

あなたはこのように試すことができます：

var bottom_reached = false; 
     $(window).scroll(function(){ 
     if ($(window).scrollTop() == ($(document).height() - $(window).height())) { 
      bottom_reached = true; 

       $('#loading-image').show(); 
      if(bottom_reached) 
      { 
       bottom_reached = false; 
       $.ajax({ 
        url: "page-2.html", 
        cache: false, 
        success: function(result){ 
         $("#part2").html(result); 
         console.log(); 
        }, 
        complete: function(){ 
         $('#loading-image').hide(); 
        } 
       }); 

      } 
      } 
      }); 

Answer 2

あなたはグローバル変数を追加し、それをこのように確認することができます最も簡単な方法：

var w = $(window); 
var BOTTOM_REACHED = false; 
window.onscroll = function(ev) { 
    if ($(document).height() - w.height() == w.scrollTop() && !BOTTOM_REACHED) { 
     BOTTOM_REACHED = true; 
     $('#loading-image').show(); 
      $.ajax({ 
       url: "page-2.html", 
       cache: false, 
       success: function(result){ 
        $("#part2").html(result); 
        console.log(); 
       }, 
       complete: function(){ 
        $('#loading-image').hide(); 
        BOTTOM_REACHED = false; 
       } 
      }); 


     } 
    };