Question

$(document).ready(function() {
  $("#firstTimeSubmit").click(function(event) {
    event.preventDefault();
    var name = $("#firstTimeText").val();
    if (name == "" || name.length > 12) {
      $("#updates").html("<b>Dummy! Invalid name!</b>");
    } else {
      $.ajax({
        type: "GET",
        url: "http://hiscore.runescape.com/index_lite.ws?player=" + name,
        success: function() {           
          $.ajax({
            type: "POST",
            url: "includes/handlers/firsttime.php",
            data: { name: name },
            success: function() {
              $("#updates").html("<b>Now tracking: " + name + "</b>");
            },
            error: function() {
              $("#updates").html("<b>Already being tracked.</b>");
            }
          }); 
        },
        error: function() {
          $("#updates").html("<b>Name doesn't exist.</b>"); 
        }               }       
      });
    }
  });
});

其他$ .ajax请求中的$ .ajax请求是否有效？

Answer 1

原则上可以工作，但你的语法错了。你想要：

success: function() {
  $.ajax({...});
}

并改变：

error: $("#updates").html("<b>Name doesn't exist.</b>");

为：

error: function() {
  $("#updates").html("<b>Name doesn't exist.</b>");
}

您上面所做的是将jquery对象分配给（匿名对象的）成功和错误属性。那不行。您需要分配一个进行jquery调用的函数。也改变：

data: "name=" + name,

到

data: {
  name: name
},

否则它是一个接一个的ajax请求。

您通常需要注意的是尝试同时执行太多Ajax请求，因为浏览器对一个域的请求数量（通常相当低）限制（例如，IE，至少某些版本，有限制） 2）。在您的情况下，请求是连续的，并且一个成功处理程序没有任何特殊之处，因为它阻止了另一个请求。

您可能希望将其中的一部分包装到命名函数中，以使代码更具可读性。

Answer 2

以可读的方式组织您的代码。这将有助于您在开发过程中大大提高。通过像下面这样拆分你可以更容易地测试，因为你可以从firebug中调用东西。它也使事情变得更加容易，因为事情变得越来越复杂。

函数名称是对其实际行为的随机猜测。

$(document).ready(function() {
    $("#firstTimeSubmit").click(function(event) {
        event.preventDefault();
        var name = $("#firstTimeText").val();
        if(name == "" || name.length > 12) {
            $("#updates").html("<b>Dummy! Invalid name!</b>");
        } else {
            getHighScore(name);
        }
    });     
});

function getHighScore(name){
    $.ajax({
        type: "GET",
        url: "http://hiscore.runescape.com/index_lite.ws?player=" + name,
        success: function() {
            setUpFirsttime(name);
        },
        error: function() {
            $("#updates").html("<b>Name doesn't exist.</b>"); 
        }
    });
}
function setUpFirsttime(name){
    $.ajax({
        type: "POST",
        url: "includes/handlers/firsttime.php",
        data: { name: name },
        success: function(){
            $("#updates").html("<b>Now tracking: " + name + "</b>");
        },
        error: function(){
            $("#updates").html("<b>Already being tracked.</b>"); 
        }
    }); 
}

jQuery：允许连续的Ajax请求？

2 个答案: