成功関数の非同期問題に関するjQueryコールバック

bugfix> jquery > 投稿

Ajax経由でXMLを取得し、成功時に関数を呼び出して処理しています。

成功関数（handleHousestark）から、XMLをチェックし、別のデータ（getJonSnow）を呼び出して追加データを追加しています。getJonSnowをasync：falseに設定すると、すべて正常に機能します。それなしでは機能しません。

$( document ).ready(function() {
  $( "#button" ).click(function() {
    $.ajax({
      url: "test_php.php?function=getmain",
      cache: false,                           
      success: handleHousestark                       
    });
  });
});
function handleHousestark(html) {   
  var feature="";
  var xml = html;
  xmlDoc = $.parseXML( xml );
  $xml = $( xmlDoc );
  $($xml).find( "features" ).children().each(function(index) {
    var attributevalue = $(this).attr('value');
    var attributeunittype = $(this).attr('type');     
    var attributecode = $(this).attr('code');  
    if(attributeunittype!="Valuelist") {
      feature=feature+"<B>"+attributevalue+"</B><BR/>";
    }
    if(attributeunittype=="Valuelist") {
      values = getJonSnow(attributecode,function(res) { 
        ///THIS WORKS WITH getJonSnow on async false, otherwise doesn't work.           feature=feature+"<B>"+res+"</B><BR/>";
      });
    }   
  }); 
  $("#content").html(feature);
}
function getJonSnow(attributecode,callback) {
  $.ajax({
    url: "test_php.php?function=getvalues",
    cache: false,     
    success:  callback                  
  });
}

jquery

function

asynchronous

回答 2 件

  • 私は $("#content").html(feature); だと思う   feature=feature+"<B>"+res+"</B><BR/>"; の前に実行される 。 サーバーへの呼び出しには、応答を戻すための時間が必要です。非同期にfalseを設定しない場合、httpリクエストから結果が来る前に以下のコードが実行されます。

  • 私は本当にうまくいったawaitとasyncでこれを達成しました。私はここ数年でajaxをやったことがなく、最新の方法論に少し遅れていました。

    以下のサンプル、私はこのサンプルをテストしませんでしたが、うまくいけば、他の人がそのことを知っています。

    $( document ).ready(function() {
  $( "#button" ).click(function() {
    $.ajax({
      url: "test_php.php?function=getmain",
      cache: false                      
    })
    .done(function(data)
                        {
                            handleHousestark(data);
                        })  ;
  });
});
async function handleHousestark(html) {   
  var feature="";
  var xml = html;
  xmlDoc = $.parseXML( xml );
  $xml = $( xmlDoc );
  $($xml).find( "features" ).children().each(function(index) {
    var attributevalue = $(this).attr('value');
    var attributeunittype = $(this).attr('type');     
    var attributecode = $(this).attr('code');  
    values=await getJonSnow(attributecode);
    if(attributeunittype!="Valuelist") {
      feature=feature+"<B>"+attributevalue+"</B>"+values+"<BR/>";
    }

    }   
  }); 
  $("#content").html(feature);
}
async function getJonSnow(attributecode) {
  const  tmp = $.ajax({
    url: "test_php.php?function=getvalues",
    cache: false               
  });
  return  tmp;
}

あなたの答え

関連記事