使用ajax调用在函数之间调用相同的函数

时间:2015-02-19 12:59:33

标签: javascript jquery ajax recursion

我有点迷失在这里! 下面这段代码显示了我打算做的事情,基本上我有这个函数insertChilds(),它在DOM级联中插入子元素(或者应该这样做......)。

这里的事情是我调用$ .ajax来获取第一个元素子元素,并且在函数之间我必须进行其他ajax调用以获取子元素的子元素,这些可能是" n" -childs。

我遇到了麻烦,因为当我进行第二次ajax调用(再次调用自身内部的相同函数)时,ajax调用会被遗忘并且项目显示为无序。

我感谢你的一些指导,我不太喜欢编程yk

代码:

function insertChilds(id, after){
     var subtar="";
     var level = "";

  $.ajax({
     url: "get_tasktypes.php",
     type: "POST",
     data: {
           id: id
           },
     dataType: "json",
     success: function(json){

      // console.log(json);

       if(json.length>0){

         if(after!= 0){
          var levelParts = after.split("-");
          level = levelParts.length;
          if(level!=0){
            var marginLeft = (level*50)+'px;';
          }else{
            var marginLeft = '50px';
          }
         }else{
          level = 0;
          var marginLeft = '50px';
         }
         subTar = subTar+'<ul class="t-tar-cont" style="margin-left:'+marginLeft+';" >';
         for(var i=0; i<json.length; i++){
           var tipoTar = "";
           var position = after+"-"+i;

           for(var h=0; h<json.length; h++){
             if(h == i){
               var childs = json[h][4];
               tipoTar = tipoTar+'<option selected value="'+json[h][0]+'">'+json[h][1]+'</option>';
               if(childs == '1'){
                  //HERE I CALL THE FUNCTION AGAIN, TELL IF THIS IS WRONG...
                   insertChilds(json[i][0], position);
               }
             }else{
               tipoTar = tipoTar+'<option value="'+json[h][0]+'">'+json[h][1]+'</option>';
             }
           }

         subTar = subTar+'<li class="gdw-tarea-sub-line-cont" id="gdw-tarea-sub-id'+position+'" style="display:none;">';
         subTar = subTar+'<div class="gdw-tarea-sub-line" style="width:100%;"><select style="width:90%;" id="gdw-selected-sub'+i+'" name="act'+i+'">'+tipoTar+'</select></div>';
         subTar = subTar+'</li>';

        }
        subTar = subTar+'</ul>';

        var afterDivID = '#gdw-tarea-sub-id'+(after);
        $(afterDivID).after(subTar);

        $('#gdw-tarea-sub-cont').css("height","auto");
         var subs = $('li[class="gdw-tarea-sub-line-cont"]');
         subs.first().show("fast", "linear", function showNext() {
             $(this).next(subs).show("fast", "linear" , showNext);
         });
       }
     }
  });
 }

在此先感谢,任何更正对我都有价值。

2 个答案:

答案 0 :(得分:0)

为什么在已经运行的调用中使用此方法,ajax调用。相反,首先通过发送单个ajax调用来收集您的所有孩子,然后将其放置。你仍然想用这种方法在循环中发送同步ajax调用而不是嵌套调用。 使ajax调用同步集

async : false

答案 1 :(得分:0)

如果您的AJAX调用是异步的,我假设它是,那么您将面临代码的两个问题。

第一个是HTTP 1.1 RFC说客户端(在您的情况下这是运行脚本的Web浏览器)应该将持久连接数限制为2. More reading here。这意味着只有两个ajax调用将同时运行,其余的将排队。如今许多浏览器都不符合这个数字,但仍然有一个限制Take a look at the answers to this question

第二个问题是,对于来自ajax调用的响应将返回到您的程序的顺序不一定有任何保证,这可能是导致您的响应以错误的顺序返回的原因。< / p>

我建议只使用一个ajax调用,将树编译成服务器端的单个数据结构,并使用ajax和json一次性传输所有内容。这样,您可以通过客户端上的结构递归,而不是为每个级别的递归调用服务器。