javascript - 使用 Ajax 传递参数(使用延迟和 promise )需要帮助

Question

这很可能是一个重复问题，因为它是学习者的常见问题，但我就是找不到针对该问题的切中要点的工作解决方案(多年来我一直试图解决这个问题!):

这起作用是因为没有Ajax:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
function first(){
var bbb;
var test = prompt("enter a number");    
    if(test == 6){
         bbb = true;    
         return bbb;
    } else {
        bbb = false;    
    }

}
function second(){
    if(first()){
        alert("returned true!!");
    } else {
        alert("returned false");    
    }
}

但是我无法让下一段代码工作，因为回调在 Ajax 调用完成之前运行。我知道 deferred 和 promise 是像这样对回调进行排序的现代方式，但在阅读和观看 TONS 之后，我仍然缺少一些关键的逻辑或语法，它对我来说不起作用。

有人可以帮我用下面的代码得到一个 deferred in action 的工作示例吗？然后从那里我将能够改进我对延迟的学习，但目前我一无所获。

//-----------------------gets much more confusing with Ajax calls------------------

function firstAjax(){
    var check = prompt("number between 1 and 10 to send (6 should return true from PHP...)");
    $.post('remote.php',
        {
        check: check
        },function(data) {
        var returned = JSON.parse(data);
        if(returned == true) {
            alert(returned);
            return true;
        } else {
            alert(returned);
            return false;
        }
    });
}

function secondAjax(){
    if(firstAjax()){
        alert("successfull return");
    } else {
        alert("return failed"); //callback runs before the post returns...
    }
}

激活功能的按钮:

<button type="button" onClick="second()">Run Local Javascript only </button>
<button type="button" onClick="secondAjax()">Run Ajax call with param passing</button>

这是“remote.php”:如果输入 = 6 返回真，则很简单。

<?php
$check = $_POST['check'];
if($check == 6){
    echo json_encode(true);
} else {
    echo json_encode(false);
}
?>

Answer 1

您正在执行异步请求，firstAjax() 将在收到响应之前返回 undefined。

您需要在firstAjax() 中定义一个回调函数作为参数，然后在收到响应时调用此函数。

function firstAjax(callback) {
  var check = prompt("number between 1 and 10 to send (6 should return true from PHP...)");
  $.post('remote',
    {check: check}, 
    function (data) {
      var returned = JSON.parse(data);
        if (returned == true) {
          alert(returned);
          callback(true);
        } else{
          alert(returned);
          callback(false);
        }
    });
}

function secondAjax() {
  firstAjax(function(result){
    if(result){
      alert("successfull return");
    }else{
      alert("return failed");
    }
  });
}