如何清除請求

Question

我想寫一個代碼，讓產品在滾動 步驟i以下類似 1]搜索產品 2]獲得的結果在一個DIV 3]對結果div的滾動希望老阿賈克斯下一個產品

，但在每一個有什麼事情發生檢索命中和滾動產品 同時 調用許多Ajax請求什麼，我想只有一次阿賈克斯應該調用（而不是舊的Ajax請求）

我jQuery代碼是

jQuery("#product_search_filter").submit(function() { 
    jQuery(".load_more_result").remove(); 
    jQuery.ajax({ 
     url: ajaxurl, 
     type: "post", 
     data: jQuery(this).serialize(), 
     dataType: "json", 
     success: function (products) { 
      var load_more = 0; 
      jQuery(".right_bar_sub_inner").html(""); 
      jQuery.each(products, function (i, data) { 
       if (this.image) { 
        jQuery(".right_bar_sub_inner").append('<div class="product_show" alt="' + i + '"> <img class="right_bar_img size-auto" src="' + this.image + '" title="'+ this.title +'"> </div>'); 
       } 
      }); 
      jQuery(".right_bar_sub_inner").append("<div class='load_more_result'>Load More...</div>"); 
      var start = false; 

      jQuery(".right_bar_sub").scroll(function(){ 
       var _data = jQuery("#product_search_filter").serialize(); 
       _data += "&offset=" + load_more; 
       jQuery(".load_more_result").css('opacity','0.1');            
       jQuery.ajax({ 
        url: ajaxurl, 
        type: "post", 
        data: _data, 
        dataType: "json", 
        success: function (products) { 
         jQuery.each(products, function (i, data) { 
          if (this.image) { 
           jQuery(".load_more_result").before('<div class="product_show" alt="' + i + '"> <img class="right_bar_img size-auto" src="' + this.image + '" title="'+ this.title +'"> </div>'); 
          } 
         }); 
         jQuery(".load_more_result").css('opacity','1'); 
         start = false; 
        } 
       }); 
       return false; 
      }); 
     } 
    }); 
    return false; 
}); 

你可以看到在 Lamp-database

試試這個問題再次進行搜索，那麼看到螢火蟲的控制檯 你可以看到第一次只有一個請求呼籲滾動 如果再次搜索那麼雙請求調用

和 等等...

Answer 1

你可能想要的是不使每個滾動事件處理Ajax請求，而是使Ajax請求，當用戶已經停止了一段時間的滾動。爲了實現這一點，您可以在每個滾動事件上重新啓動計時器，在達到特定值（例如250ms）後，將觸發實際的ajax請求。

例如你可以 每個滾動調用滾動（）

var timeoutid; 
jQuery(".right_bar_sub").scroll(function() { 
    scrolled(); 
    //... 
}); 

function scrolled() { //delay the request. 
    clearTimeout(timeoutid); //otherwise it will be called multiple times 
    timeoutid=window.setTimeout("ajaxcall()", 250); //make ajax request in 250 ms 
} 

function ajaxcall() { 
//make your ajax request here 
}