php - JQuery ajax 函数可以工作，但无法正确返回变量

Question

我有一个运行正常的函数 runAjax。不幸的是，我正在努力返回从 ajax 查询中获得的值。

ajax 函数将“contents”或“error”xml 标记内的返回值分配给变量“result”。

如果我警告ajax函数内的结果变量，它会警告正确的值(即，如果内容内的xml值是“已发布”，它会警告已发布)。

但是，如果我警告 runAjax 函数的返回值，它会警告一个对象，而不是内部变量“结果”的值，在上面的示例中该值是“已发布”。

function runAjax (data_obj){
  return $.ajax({
      url:"/ajax.php",
      dataType: "xml",
      data: data_obj,
      success: function(data) {
        // format result
        var xml;
        if (typeof data == "string") {
          xml = new ActiveXObject("Microsoft.XMLDOM");
          xml.async = false;
          xml.loadXML(data);
        } else {
          xml = data;
        }
        var result;
        if($("error",xml).text()){
          result = [$("error",xml).text()];
        } else{
          result = [
            $("contents", xml).text()
          ];
        }
      alert(result); //alerts the correct string for example "published"
      return result;
      }
    });
  }
  $('ul.content li span.changeable').click(function(e){
    e.preventDefault();
    var method_set = $(this).parent().attr("class");
    var id_set = $(this).parent().parent().find('li.id span').html();
    var user = $(this);
    var result = runAjax({method: method_set, id: id_set});
    alert(result); //alerts an object not published

  });

我确信这与我返回变量的方式有关，但我无法弄清楚。任何意见将不胜感激。

问候卢克

更新:这是修订后的代码，感谢以下人员的所有输入:

  function runAjax (data_obj,callback){
    $.ajax({
      url:"/ajax.php",
      dataType: "xml",
      data: data_obj,
      success: function(data) {
        // format result
        var xml;
        if (typeof data == "string") {
          xml = new ActiveXObject("Microsoft.XMLDOM");
          xml.async = false;
          xml.loadXML(data);
        } else {
          xml = data;
        }
        var result;
        if($("error",xml).text()){
          result = [$("error",xml).text()];
        } else{
          result = [
          $("contents", xml).text()
          ];
        }
        if ( typeof(callback) == "function") {
          callback(result);
        }
      }
    });
  }
  $('ul.content li span.changeable').click(function(e){
    e.preventDefault();
    var method_set = $(this).parent().attr("class");
    var id_set = $(this).parent().parent().find('li.id span').html();
    var user = $(this);
    runAjax({
      method: method_set, 
      id: id_set
    },
    function(result){
      $(user).html(result.join('')); //this is instead of alert(result);
    }
    );

  });

Answer 1

根据docs

The $.ajax() function returns the XMLHttpRequest object that it creates.

从成功回调函数返回的任何返回值都将被忽略。

您需要将值放入比回调函数内部更广泛范围内定义的变量中(全局，或者最好在外部函数内部)。

   var result;
   $.ajax({
       ....
       success : function(data) {
          ...
          result = ...;
       }
   });

或者更好的是:在成功回调函数中对返回值执行任何您想要执行的操作，这将保持 ajax 调用的异步性质，并且意味着您不需要等待调用返回。

在成功回调函数中进行处理意味着您知道您已经得到了结果，如果您将值放入变量中，则在您想要使用它时该变量可能尚未分配值。

在对此页面上另一个答案的评论中，您说:

however I am calling the runAjax function from multiple other functions not just the one in my code example above, so I need the value returned rather than the runAjax function doing the html replacing

我会向您的 runAjax 函数添加一个额外的参数，这是另一个回调函数，您可以从各个函数传入不同的处理函数。

function runAjax(data_obj, callback) {
    $.ajax({
        ...
        success : function(data) { 
            ...
            result = ...
            ...
            if ( typeof(callback) == "function") {
                callback(result);
            }
        }
    });
}

然后你可以这样调用它

runAjax({method: method_set, id: id_set},
    function(result){
         alert(result);
    }
);

然后您可以在成功函数中对数据进行通用处理，但在回调函数中对每个调用进行自定义处理。

如果确实需要等待调用，可以通过传递 async 选项来创建同步 ajax 调用:

 $.ajax({
    async:false,
    ....