jquery wait on response

Question

私はクエリで作業して以来、しばらくしていました。私の人生では、これが応答を待っていない理由を理解できません。私はthis postのような答えを探しました。私はかなり簡単な何かを見逃すはずです。

呼び出し機能：

$('#cappuccino-button').click(function() { 
    $('#screen-one').hide();  
    var hasMilk = IsThereMilk(); 
    if (hasMilk) { 
     $('#cappuccino-success').show(); 
    } else { 
     $('#milk-fail').show(); 
    } 
} 

機能自体：

function IsThereMilk() { 
    $.ajax({ 
     url: 'http://milkstore/gotany', 
     type: 'GET', 
     async: false, 
     success: function(data){ 
      console.log('*****AJAX' + data.hasMilk); 
      return data.hasMilk; 
     } 
    }); 
} 

は、誰もが私の呼び出し関数は、AJAXリクエストを待機していない理由を私は識別しやすくすることができますか？

Answer 1

IsThereMilk()呼び出しは実際に値を返しません。 $.ajax()が返されたとしても、値はBooleanではなくjQuery約束オブジェクトになります。

は応答data.hasMilk

function IsThereMilk() { 
    return $.ajax("http://milkstore/gotany"); 
} 

$("#cappuccino-button").click(function() { 
    $("#screen-one").hide();  
    var hasMilk = IsThereMilk(); 
    hasMilk.then(function(data) { 
     if (data.hasMilk) { 
     $("#cappuccino-success").show(); 
     } else { 
     $("#milk-fail").show(); 
     } 
    }) 
}) 

jsfiddle https://jsfiddle.net/r8hc6nna/

Answer 2

あなたはアヤックス成功に条件hasMilkを移動しようと持っているかどうかを確認するためにIsThereMilk()呼び出し、.then()からreturn$.ajax()に、jsを調整してみてください？

function IsThereMilk() { 
    $.ajax({ 
     url: 'http://milkstore/gotany', 
     type: 'GET', 
     async: false, 
     success: function(data){ 
      console.log('*****AJAX' + data.hasMilk); 
      if (data.hasMilk) { 
       $('#cappuccino-success').show(); 
      } else { 
       $('#milk-fail').show(); 
      } 
     } 
    }); 
} 

$('#cappuccino-button').click(function() { 
    $('#screen-one').hide();  
    IsThereMilk(); 
}