Ajax jquery异步返回值答案

【问题标题】：Ajax jquery async return valueAjax jquery异步返回值
【发布时间】：2011-06-01 02:28:31
【问题描述】：

我怎样才能让这段代码返回值不冻结浏览器。
你当然可以用新方法重写它。

function get_char_val(merk)
{  
    var returnValue = null;
    $.ajax({   
                type:       "POST",
                async:      false,   
                url:            "char_info2.php",   
                data:   { name: merk },   
                dataType: "html",  
                success:    function(data)
                                    {
                                        returnValue = data;
                                    } 
        }); 
    return returnValue;
}
var px= get_char_val('x');
var py= get_char_val('y');

编辑： 在其他时间我需要从 php 文件中获取至少 20 个变量。

【问题讨论】：

我添加了一些明显需要的重点。
我已经无数次看到这个问题（或一些变体）。必须有无穷无尽的重复。如果人们在尝试使用 ajax 或任何其他异步 api/语言之前可以阅读更多关于异步事件编程的知识...
或者至少明白异步这个词是什么意思。

标签： jquery ajax asynchronous return

【解决方案1】：

这是不可能的。
Javascript 在 UI 线程上运行；如果您的代码等待服务器回复，则浏览器必须保持冻结状态。

相反，您需要使用回调返回值：

function get_char_val(merk, callback)
{  
    var returnValue = null;
    $.ajax({   
                type:       "POST",
                url:            "char_info2.php",   
                data:   { name: merk },   
                dataType: "html",  
                success:    function(data) {
                    callback(data);
                } 
        }); 
}

get_char_val('x', function(px) { ... });
get_char_val('y', function(py) { ... });

请注意，这两个回调将以不可预知的顺序运行。

您应该修改您的设计，以便可以在一个 AJAX 请求中获取所有二十个值。
例如，您可以获取一个逗号分隔的值列表，并返回一个 JSON 对象，例如 { x: "...", y: "..." }。

【讨论】：

正确，从技术上讲，您不能在异步请求中使用返回值，因为在响应到达时，程序流已经从第一个方法中通过了“返回”点。
但我应该在 function(px) { > } 中输入什么
@Sonny：随便你。这就是接收值的回调。
@SLaks 所以我不需要在那里输入任何东西？
@Sonny：那是因为它是异步的。没有魔法逃生舱；你需要在回调中做所有事情。将设计更改为使用单个 AJAX 请求将使其更加更简单。

【解决方案2】：

您不能以这种方式进行变量分配（异步）。您必须在 success 处理程序中设置变量。

variableArray = new Array(); 

get_char_val('x');
get_char_val('y');

function get_char_val(merk)
{  
    var returnValue = null;
    $.ajax({   
        type:       "POST",
        url:            "char_info2.php",   
        data:   { name: merk },   
        dataType: "html",  
        success:    function(data)
            {
                variableArray[merk] = data;
            } 
    }); 
}

完成所有检索后，您可以使用 variableArray[x] 和 variableArray[y] 访问 x 和 y 变量

【讨论】：

从不使用async: false。
sry 我需要其他变量来获得价值，因为我还有 20 个其他变量要定义
然后你需要想出一个数组（可能有诸如px和py之类的键）并让成功处理程序管理它：variableArray[merk] = data;
@SLaks，只是重新粘贴。很好的收获。
那应该是一个对象，而不是一个数组。

【解决方案3】：

这可能不是您所期望的，但您可以设置 async: true 如果您不想在浏览器中暂停，那么您想在成功时使用 px 做什么

【讨论】：