Jquery - 2 Ajax请求不工作在同一页

Question

所以我有这个问题的一天，我无法发送来自同一页的2个Ajax请求。 我读过的大部分文档是关于在同一页面上运行jquery的2个版本，与没有冲突的方法 但我试图发送2个Ajax请求，使用相同版本的Jquery。

继承人我的代码

<script> 
$(document).ready(function(){ 
    var username = $("title").html(); 
    $.post("functions/userdetails.php", {username: username}, 
    function(result){ 
     if(result == 'nf'){ 
      alert("The Account Doesnt Exist"); 
     } 
     else{ 
      var obj = JSON.parse(result); 
      $.each(obj, function(key, val) {   // iterate over results 
      $("#name").html(val.fname+" "+val.lname); 
      $("#bio").html(val.bio); 
      $("#username").html("@"+val.username); 
      $("#tid").html(val.id); 
     })   
    } 
    } 
); 
}); 
$(document).ready(function(){ 
    var tid = $("tid").html(); 
    var myid = $("myid").html(); 
    $.post("functions/checkrelations.php", {tid: tid, myid:myid}, 
    function(result){ 
     if(result == 'nf'){ 
      $("#sendr").show(); 
      $("#cancel").hide(); 
     } 
     else{ 
      $("#cancel").show(); 
      $("#sendr").hide(); 
     })   
    } 
    } 
); 
}); 
</script> 

它工作得很好，如果我只有一个要求，但是当我把这些结合在一起，他们没有工作。

Answer 1

这里是你的代码的编辑版本，这可能会帮助你

$(document).ready(function(){ 
     var username = $("title").html(); 
     $.post("functions/userdetails.php", {username: username}, 
     function(result){ 
      if(result == 'nf'){ 
       alert("The Account Doesnt Exist"); 
      } 
      else{ 
        var obj = JSON.parse(result); 
        $.each(obj, function(key, val) {   // iterate over results 
        $("#name").html(val.fname+" "+val.lname); 
        $("#bio").html(val.bio); 
        $("#username").html("@"+val.username); 
        $("#tid").html(val.id); 
       }); 

       //here is the first ajax calls completes succesfully and your 
       //new html is build so second ajax must be called from here 

        var tid = $("#tid").html(); 
        var myid = $("#myid").html(); 
        $.post("functions/checkrelations.php", {tid: tid, myid:myid}, 
        function(result){ 
          if(result == 'nf'){ 
           $("#sendr").show(); 
           $("#cancel").hide(); 
          } 
          else{ 
           $("#cancel").show(); 
           $("#sendr").hide(); 
          }  
         }    
       ); 
      } 
     } 
    ); 
}); 

Answer 2

由于Ananthakrishnan吧唧的评论说，看来你的第二个功能，取决于你的第一个功能。

第二个函数还有一些其他问题。 ID缺少jQuery选择器中的哈希标记。该函数的右括号似乎在else语句中被捕获。

我不推荐嵌套函数，而是深入到代码的嵌套块中，我建议使用Promises来保持代码深度低并处理错误。就像这样：

$(document).ready(function(){ 
    var username = $("title").html(); 
    // Make your first request 
    $.post("functions/userdetails.php", {username: username}) 
    // Handle the first response 
    .then(function(result) { 
     if (result === 'nf') { 
      // Use promise chain rejection to handle errors. 
      return $.Deferred().reject("The Account Doesn't Exist"); 
     } else { 
      var obj = JSON.parse(result); 
      // Are there actually multiple, here? 
      // This will overwrite on each loop. 
      $.each(obj, function(key, val) {   
       $("#name").html(val.fname + " " + val.lname); 
       $("#bio").html(val.bio); 
       $("#username").html("@" + val.username); 
       $("#tid").html(val.id); 
      }); 
     } 
    }) 
    // Make the next request. 
    .then(function() { 
     var tid = $("#tid").html(); 
     var myid = $("#myid").html(); 
     return $.post("functions/checkrelations.php", {tid: tid, myid:myid}); 
    }) 
    // Update the appearance 
    .then(function(result) { 
     if (result === 'nf') { 
      $("#sendr").show(); 
      $("#cancel").hide(); 
     } else { 
      $("#cancel").show(); 
      $("#sendr").hide(); 
     } 
    }) 
    // This is the "catch" logic. 
    .then(null, function(errorMessage) { 
     if (typeof errorMessage === 'string') { 
      alert(errorMessage); 
     } else { 
      // If the requests error, or the JSON.parse throws, we end up here. 
      alert('Something went wrong!'); 
     } 
    } 
});