jQuery $.ajax() 调用挂起，在调用结束之前我什么也做不了答案

【问题标题】：jQuery $.ajax() call is hanging and I cannot do nothing until the call endsjQuery $.ajax() 调用挂起，在调用结束之前我什么也做不了
【发布时间】：2014-04-23 19:41:20
【问题描述】：

你好；

当我从jQuery ajax 使用时，页面会冻结直到请求结束。这是我的 JavaScript 代码：

function GetAboutContent(ID, from) {
var About = null;

if (from != true)
    from = false;

$.ajax({
    type: "POST",
    url: "./ContentLoader.asmx/GetAboutContent",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    data: JSON.stringify({ 'ID': ID, 'from': from }),
    async: true,
    success: function (msg) {
        var Result = msg.d.Result;

        if (Result == 'session') {
            warning('Your session has expired, please login again!');
            setTimeout(function () {
                window.location.href = "Login.aspx";
            }, 4000);
            return;
        }

        if (Result == 'failed' || Result == false) {
            About = false;
            return;
        }

        About = JSON.parse(msg.d.About)[0];
    }
});

return About;

}

这是我的WebService

[WebMethod(EnableSession = true)]
public object GetAboutContent(int ID, bool from = false)
{
    try
    {
        if (HttpContext.Current.Session["MahdParent"] != null ||
            HttpContext.Current.Session["MahdTeacher"] != null ||
            from)
        {
            functions = new GlobalFunctions();
            DataTable queryResult = new DataTable();

            queryResult = functions.DoReaderTextCommand("SELECT Field FROM TT WHERE  ID = " + ID);
            if (queryResult.Rows.Count != 0)
                return new { Result = true, About = JsonConvert.SerializeObject(queryResult.Rows[0].Table) };
            else
                return new { Result = false };
        }
        else
            return new { Result = "session" };
    }
    catch (Exception ex)
    {
        return new { Result = "failed", Message = ex.Message };
    }
}

我该如何解决这个问题？ 请帮帮我

【问题讨论】：

你不能从异步函数返回结果
How to return the response from an AJAX call? 的可能重复项
你的意思是我应该将async 设置为false
不，我不是那个意思，在任何情况下你都不应该这样做，而是阅读上面发布的链接。
你不需要 JSON.stringify 你可以传入对象。如果你的数据类型不确定你在 About 中有什么，你也不应该需要 JSON.parse。

标签： javascript jquery asp.net ajax webmethod

【解决方案1】：

在最后一行中，您尝试返回 About。由于 AJAX 请求的异步性质，这无法正常工作。当您的 AJAX 请求的成功函数运行时，您声明 return About 的点不再存在。

我假设你尝试做这样的事情：

$('div#content').html(GetAboutContent());

在像 PHP 或 Perl 这样的程序语言中，这可以正常工作，但 JavaScript 以非常不同的方式运行。要完成这样的工作，您需要执行以下操作：

$.ajax({
    type: "post",
    url: "./ContentLoader.asmx/GetAboutContent",
    dataType: "json",
    data: { 
      'ID': ID, 
      'from': from 
    },
    success: function(result) {
        $('div#content').html(result)
    }
});

这两段代码之间的区别在于，第一段代码期望 JavaScript 在您请求它时知道该值。但是，您的函数 GetAboutContent() 无法即时访问这些数据。相反，它会触发一个 AJAX 请求并在此之后立即结束，该请求仍在进行中的时间未知。

一旦请求成功完成，JavaScript 就可以使用数据。您可以在为success 定义的回调函数中使用它。到那时，请求与启动它的函数完全没有联系。这就是为什么它是异步的。

【讨论】：