jQuery嵌套ajax不起作用

Question

调用嵌套ajax时，最内层的ajax不起作用。如以下示例所示，我将getInnerResp调入getResult。通常当我用萤火虫调试是有趣的作品。我认为它的行为是async false，但我设置为false的async属性不再工作。此外，我试图在getInnerResp函数中使用回调函数获取结果集。不幸的是，我没有任何成功。 getResult函数中的ftbl变量也返回null。 getInnerResp只会跟随结果;

结果

<tr><td colspan='3'></td></tr><tr><td colspan='3'></td></tr><tr><td colspan='3'></td></tr><tr><td colspan='3'></td></tr> 

的Javascript

function getResult(year){ 

    var visible = true; 
    var table = $(".tbl"), tbody = $(".result").find("tbody"), ftbl = ""; 

    table.find("tbody>tr").each(function(){ 
     var data = { 
      course : $(this).find(".course").val(), 
      year : year, 
      prog : $(this).find(".program").val() 
     } 

     if(year.length < 1){ 
      alert("Year field can not be empty!!"); 
      visible = false; 
      return false; 
     } 

     $.ajax({ 
      url : "result.php", 
      method : "GET", 
      data : data, 
      contentType: "application/json; charset=utf-8", 
      traditional : true, 
      success : function(d){   
       tbody.append("<tr><td>" + course + "</td><td>" + d.enrolledStudent + "</td><td>" + d.failedStudent + "</td>"); 
       if(visible){ 
        ftbl += getInnerResp(course, year); 
        console.log("inner" + ftbl); 
       } 
      }, 
      error : function(XMLHttpRequest, textStatus, errorThrown){ 
       alert("Javascript runtime error: " + textStatus); 
      } 
     }); 
    }); 

    if(visible){ 
     tbody.append(ftbl); 
    } 
} 

function getInnerResp(course, year){ 

    var tbl = ""; 

    var data = { 
     course : course, 
     year : year 
    } 

    for(var i = 0; i < 5; i++){ 
     tbl += "<tr><td colspan='3'></td></tr>"; 
    } 

    $.ajax({ 
     url : "course.php", 
     method : "GET", 
     data : data, 
     contentType: "application/json; charset=utf-8", 
     success : function(json){   
      $.each(json, function(i, val){ 
       tbl += "<tr><td>" + course + "</td><td colspan='2'>" + val + "</td></tr>"; 
      }); 
     }, 
     error : function(XMLHttpRequest, textStatus, errorThrown){ 
      alert(textStatus); 
     } 
    }); 

    return tbl; 
} 

Answer 1

这是你的问题：

ftbl += getInnerResp(course, year); 

你试图给一个局部变量在未来（异步）产生的价值。

尝试移动任务在内的功能，如：

function getResult(year){ 

     var visible = true; 
     var table = $(".tbl"), tbody = $(".result").find("tbody"), ftbl = ""; 

     table.find("tbody>tr").each(function(){ 
      var data = { 
       course : $(this).find(".course").val(), 
       year : year, 
       prog : $(this).find(".program").val() 
      } 

      if(year.length < 1){ 
       alert("Year field can not be empty!!"); 
       visible = false; 
       return false; 
      } 

      $.ajax({ 
       url : "result.php", 
       method : "GET", 
       data : data, 
       contentType: "application/json; charset=utf-8", 
       traditional : true, 
       success : function(d){ 
        tbody.append("<tr><td>" + course + "</td><td>" + d.enrolledStudent + "</td><td>" + d.failedStudent + "</td>"); 
        if(visible){ 
         // 
         // do the remaing in the inner task.... 
         // 
         getInnerResp(course, year, tbody); 
        } 
       }, 
       error : function(XMLHttpRequest, textStatus, errorThrown){ 
        alert("Javascript runtime error: " + textStatus); 
       } 
      }); 
     }); 

    } 

    function getInnerResp(course, year, tbody){ 

     var tbl = ""; 

     var data = { 
      course : course, 
      year : year 
     } 

     for(var i = 0; i < 5; i++){ 
      tbl += "<tr><td colspan='3'></td></tr>"; 
     } 

     $.ajax({ 
      url : "course.php", 
      method : "GET", 
      data : data, 
      contentType: "application/json; charset=utf-8", 
      success : function(json){ 
       $.each(json, function(i, val){ 
        tbl += "<tr><td>" + course + "</td><td colspan='2'>" + val + "</td></tr>"; 
       }); 
       tbody.append(tbl); 
      }, 
      error : function(XMLHttpRequest, textStatus, errorThrown){ 
       alert(textStatus); 
      } 
     }); 

     console.log("inner" + tbl);; 
    } 

Answer 2

在的getResult功能的ajax成功回调，正在使用的 '课程' 的变量，但它并没有在任何地方定义。它可能会导致异常，这会在调用getInnerResp之前停止脚本执行。