0

jQueryを使用してXMLファイルからドロップダウンボックスにデータを入力しようとしています。コードを実行すると、順番に実行されているように見えます。

jQuery：

  $("#filterButton").click(function() {
    var dropdown = new Array();
    $.get('../restaurants.xml', function (xmlFile) {
      $(xmlFile).find('restaurant').each(function () {
        var found = false;
        var $restaurant  = $(this);
        var type = $restaurant.attr("type");

        dropdown.forEach(function(arrayValue){
          if(arrayValue == type){
            found = true;
          }
        });
        if(found == false){
          dropdown.push(type);
        }
      });
    });
    $('#potentialRestaruants').append('<select>');
      dropdown.forEach(function(arrayValue){
        $('#potentialRestaruants').append('<option value="' + arrayValue + '">' + arrayValue + '</option>' );
      });
      $('#potentialRestaruants').append('</select>'); 
  });

ただし、コードは次の順序で実行されています。

  $("#filterButton").click(function() {
    var dropdown = new Array();

それから

$('#potentialRestaruants').append('<select>');
      dropdown.forEach(function(arrayValue){
        $('#potentialRestaruants').append('<option value="' + arrayValue + '">' + arrayValue + '</option>' );
      });
      $('#potentialRestaruants').append('</select>'); 
  });

それから

$.get('../restaurants.xml', function (xmlFile) {
  $(xmlFile).find('restaurant').each(function () {
    var found = false;
    var $restaurant  = $(this);
    var type = $restaurant.attr("type");

    dropdown.forEach(function(arrayValue){
      if(arrayValue == type){
        found = true;
      }
    });
    if(found == false){
      dropdown.push(type);
    }
  });
});

コードがこの順序で実行されるのはなぜですか。また、必要な順序でコードを実行するにはどうすればよいですか。

4

1 に答える 1

1

$ .getは非同期で実行されるため、説明した順序で実行されます。したがって、$。get関数の正常な実行に依存するコードも、その関数の最後、つまり、appendと2番目のforEachに含める必要があります。

于 2013-02-20T18:25:14.460 に答える