javascript - 序列化函数调用

Question

我有一个具有某些值的 javaScript 对象。我需要调用函数的次数与对象具有值的次数一样多。看一下代码片段

for(var i=0; i < scroll["altscroll"]; i++){
    more_alt_leftajaxsearchcategory(0, 0, element=false, back = true);
}

被调用的函数通过ajax方法加载一些元素并将其附加到主体中。 问题是，当循环执行时，函数被立即调用，但被调用的函数返回的结果不按预期的顺序。例如，如果函数被调用 3 次，并且如果最后一次调用的返回结果尺寸较小，则它首先附加到正文中，然后附加另一个返回结果。 我们可以序列化函数调用，以便在第一个函数完成之前不会调用另一个函数吗？ 被调用的函数代码片段:

var pageCount = 1;  
function more_leftajaxsearchcategory(locval,pageid, element, back){

    var offsetCount = pageCount * 10;
      var dataString = jQuery("#leftformid").serialize();   
      jQuery.ajax({
        url:"<?php echo admin_url('admin-ajax.php'); ?>",
        type:'POST',
        data: 'action=leftmenusearchcategory'+'&locationval='+locval+'&numb='+offsetCount+'&'+dataString,           
        beforeSend: function(){jQuery('body').append('<p class="overBck"><img alt="Loading..." src="<?php bloginfo('template_url'); ?>/images/ajax-loader.gif" style="margin-top:25%;"></p>'); },
        success:function(results, status)
        {       
                jQuery(".book_results").append(results);
                if(results == 'Sorry no results found. Please search again.'){
                    jQuery('.sidebar_loadMore').hide();
                    pageCount =1;
                }
                jQuery('.overBck').remove();
                 short_deals_attr();

        }

      });
    pageCount++;
}

我已经删除了不必要的代码。您也可以查看现场Bestofthebrunch

Answer 1

我发现在这种情况下序列化函数调用的最佳方法是在前一个函数调用成功的基础上进行递归调用。

more_alt_leftajaxsearchcategory(0, 0, element=false, back = true, scroll["altscroll"] -1);

并在 Ajax 成功时更新了被调用的函数

 if(back && loadtimes > 0){
    more_alt_leftajaxsearchcategory(0, 0, element=false, back = true, loadtimes-1 ); 
}

像这样...

var pageCount = 1;  
function more_leftajaxsearchcategory(locval,pageid, element, back, times){
var offsetCount = pageCount * 10;
  var dataString = jQuery("#leftformid").serialize();   
  jQuery.ajax({
    url:"<?php echo admin_url('admin-ajax.php'); ?>",
    type:'POST',
    data: 'action=leftmenusearchcategory'+'&locationval='+locval+'&numb='+offsetCount+'&'+dataString,           
    beforeSend: function(){jQuery('body').append('<p class="overBck"><img alt="Loading..." src="<?php bloginfo('template_url'); ?>/images/ajax-loader.gif" style="margin-top:25%;"></p>'); },
    success:function(results, status)
    {       
            jQuery(".book_results").append(results);
            if(results == 'Sorry no results found. Please search again.'){
                jQuery('.sidebar_loadMore').hide();
                pageCount =1;
            }

            if(back && loadtimes > 0){
                more_alt_leftajaxsearchcategory(0, 0, element=false, back = true, loadtimes-1 ); 
            }

            jQuery('.overBck').remove();
             short_deals_attr();

    }

  });
pageCount++;
}

在此方法中，不会立即调用函数 more_leftajaxsearchcategory，而不关心先前调用的响应。仅当第一个函数得到响应时才会调用该函数。