Question

我想显示存储在ch中的数据！但我的问题是在存储数据之前显示ch！我认为这是一个异步问题！我怎么解决这个问题。当我尝试获得ch的长度时，我总是得到0.即使我将数据静态存储在ch中，我得到的长度为0。我认为这是一个异步问题！我该如何解决这个问题。

功能RechercheFiltrée（）{

var nom = document.getElementById('nompre').value;
var matricule = document.getElementById('matcle').value;

$.ajax({
    url: "myWebServiceURL",
    type: "GET",
    dataType: "xml",
    success: function(xml) {
      var stock = [];
      $(xml).find('Population').each(function() {
          var table = document.getElementById("myTable");
          $(this).find("directories").each(function() 
            {
              dossier = $(this).attr('dossier');
              stock.push(dossier);
            });
          });

    var ch = [];
    for (var i = 0; i < stock.length; i++) {
      $.ajax({
        url: "/mySecondWebServiceURL" + stock[i],
        type: "GET",
        dataType: "xml",
        success: function(xml) {
          var NMPRES = "";
          var jsonObj = JSON.parse(xml2json(xml, ""));
          var nom = jsonObj.SubmitResponse.occurrences.occurrence.filter(x => x["@datasection"] === "TS")[0].data.filter(x => x.item === "NMPRES")[0].value;
          var matcle = jsonObj.SubmitResponse.occurrences.occurrence.filter(function(x) {
            return x["@datasection"] === "LM"
          })[0].data.filter(x => x.item === "MATCLE")[0].value;

          var dossier = jsonObj.SubmitResponse.occurrences.occurrence.filter(function(x) {
            return x["@datasection"] === "LM"
          })[0]["@dossier"];

          ch.push({
            "nom": nom,
            "matcle": matcle,
            "dossier": dossier
          });
          if ($('#population').val() != null && firstIter == false) {

          }
        },
        error: function(request, error) {
          console.log('error Connexion : ' + error + ' request Connexion : ' + request);
        }
      });
    }

    var txt = "";
    var firstIter = true;

    for (var key in ch) {
      if (ch[key].matcle === matricule) {
        txt += "<option  value='" + ch[key].dossier + "'" + firstSelect(firstIter) + ">" + ch[key].nom + "</option>";

        firstIter = false;
      }
    }
    $('#population').html(txt)
  },
  error: function(request, error) {
    console.log('error Connexion : ' + error + ' request Connexion : ' + request);
  }
});

}

Answer 1

问题是您没有等待第二个服务回复。它应该是这样的：

const deferreds = stock.map((stockItem) => {
   //... your logic with ch.push here
   return $.ajax({
      // your call to the second service
   });
});

$.when(...deferreds).then(() => {
   // your code 
   // for (var key in ch) {
});

Answer 2

我宁愿采取的方法是打破代码并使用Promises。你真的应该花时间学习Promises。这是一个JavaScript标准以及jQuery使用的内容。

function RechercheFiltrée() {
  var nom = document.getElementById('nompre').value;
  var matricule = document.getElementById('matcle').value;

  return $.ajax({
      url: "myWebServiceURL",
      type: "GET",
      dataType: "xml"
  });
}

function getStockArray(xml) {
  var stocks = [];

  $(xml).find('Population').each(function() {
      var table = document.getElementById("myTable");
      $(this).find("directories").each(function() {
        {
          dossier = $(this).attr('dossier');
          stocks.push(dossier);
        });
      });
  });

  return stocks;
}

function getStocks(stocks) {
  return Promise.all(stocks.map(fetchStock));
}

function fetchStock (stock) {
  return $.ajax({
    url: "/mySecondWebServiceURL" + stock,
    type: "GET",
    dataType: "xml"
  })
  .then(formatStockInfo)
}

function formatStockInfo (xml) {
    var NMPRES = "";
    var jsonObj = JSON.parse(xml2json(xml, ""));
    var nom = jsonObj.SubmitResponse.occurrences.occurrence.filter(x => x["@datasection"] === "TS")[0].data.filter(x => x.item === "NMPRES")[0].value;
    var matcle = jsonObj.SubmitResponse.occurrences.occurrence.filter(function(x) {
      return x["@datasection"] === "LM"
    })[0].data.filter(x => x.item === "MATCLE")[0].value;

    var dossier = jsonObj.SubmitResponse.occurrences.occurrence.filter(function(x) {
      return x["@datasection"] === "LM"
    })[0]["@dossier"];

    if ($('#population').val() != null && firstIter == false) {

    }

    return {
      "nom": nom,
      "matcle": matcle,
      "dossier": dossier
    };    
}

function updateSelectMenu (ch) {
  var txt = "";
  var firstIter = true;

  for (var key in ch) {
    if (ch[key].matcle === matricule) {
      txt += "<option  value='" + ch[key].dossier + "'" + firstSelect(firstIter) + ">" + ch[key].nom + "</option>";

      firstIter = false;
    }
  }

  $('#population').html(txt)
}

RechercheFiltrée()
  .then(getStockArray)
  .then(getStocks)
  .done(updateSelectMenu);

如何处理javascript中的异步问题

2 个答案: