为什么我的代码在使用AJAX时进入无限循环?

时间:2015-04-28 09:00:04

标签: javascript ajax infinite-loop

我正在使用这两个函数来尝试将客户和订单添加到我的数据库。我遇到的问题是我想执行添加客户,然后添加addOrder但是当我以这种方式尝试时,它会进入一个无限循环。

function addCustomer(){
  customer = localStorage.getItem('customer');
  jsonCustomer = JSON.parse(customer);

  var xmlhttp = new XMLHttpRequest();

  if(xmlhttp){
    xmlhttp.onreadystatechange = function(){
      if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
        response = JSON.parse(xmlhttp.responseText);

        customerID = response[0].ID;
        customerFirstName = response[0].FirstName;
        customerSurname = response[0].LastName;
        customerEmail = response[0].Email;
        customerPhoneNumber = response[0].PhoneNumber;
        customerAddress = response[0].Address;
        customerTowm = response[0].Town;
        customerCounty = response[0].County;
        customerPostCode = response[0].PostCode;

        details = "<p>ID: " + customerID + "</p>" + "<p>First Name: " + customerFirstName + "</p>" + "<p>Surname: " + customerSurname + "</p>" + "<p>Email: " + customerEmail + "</p>" + "<p>Phone Number: " + customerPhoneNumber + "</p>" + "<p>Address: " + customerAddress + "</p>" +
                  "<p>Town: " +  + "</p>" + "<p>County: " + customerCounty + "</p>" + "<p>Post Code: " + customerPostCode + "</p>";
        Alert.render("Customer Added", details);

      }
    }
  var url = "addCustomer.php?firstName=" + jsonCustomer.FirstName + "&surname=" + jsonCustomer.Surname + "&email=" + jsonCustomer.Email + "&phoneNumber=" + jsonCustomer.PhoneNumber + "&address=" + jsonCustomer.Address + "&town=" + jsonCustomer.Town + "&county=" + jsonCustomer.County + "&postCode=" + jsonCustomer.PostCode;
  xmlhttp.open("GET", url, false);
  xmlhttp.send();

  addOrder(customerID);

  }
}


function addOrder(customerID){
  customerID = addCustomer();
  var xmlhttp = new XMLHttpRequest();


  if(xmlhttp){
    xmlhttp.onreadystatechange = function(){
      if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
        console.log(xmlhttp.responseText);

        response = JSON.parse(xmlhttp.responseText);

        orderID = response[0].ID;
        orderDate = response[0].Date;
        orderPrice = response[0].TotalPrice;
        orderCustomerID = response[0].Customer_ID;


        details = "<p>ID: " + orderID + "</p>" + "<p>Date: " + orderDate + "</p>" + "<p>Total Price: " + orderPrice + "</p>" + "<p>Customer ID: " + orderCustomerID + "</p>";
        Alert.render("Customer Added", details);


      }
    }

    var url = "../Administration/Checkout/addOrder.php?customerID=" + customerID + "&totalPrice=" + totalPrice;
    xmlhttp.open("GET", url, false);
    xmlhttp.send();

  }
}

2 个答案:

答案 0 :(得分:3)

  • addCustomer将始终在addOrder结束前致电XMLHttpRequest(除非浏览器不支持addCustomer。)
  • addOrder将始终致电addCustomer(在其第一行)。

你需要一个条件来阻止其中一个调用发生,以避免无限循环。

答案 1 :(得分:3)

你有addCustomer()来电addOrder,它在第一行再次调用addCustomer,这就是无限通话的原因。

由于addOrder方法需要customerId ajax调用返回的addCustomer,因此您需要在{{1}成功的范围内调用addOrder方法并且可以将addCustomer作为婴儿车传递给customerId方法。

addOrder