AJAX--前后台交互

注：ajax通过async参数决定是异步还是同步,false同步,true异步;

　　异步执行顺序是先执行后续动作，再执行success里代码;

　　同步是先执行success里代码，再执行后续代码;

验证：同步时数据量大是否会卡顿？例如从后台搜索大量数据时，页面是否卡死？

 

1、(异步)方法调用，后续代码不需要等待它的执行结果
　　后台<C#>:

using System.Web.Script.Services; 
  
[WebMethod] 
public static string GetStr(string str1, string str2) 
{ 
    return str1 + str2; 
}
 
前台<JQuery>:

function Test(strMsg1,strMsg2) 
{
    $.ajax({
        type: "Post",
        url: "Demo.aspx/GetStr",
        async: true,
        //方法传参的写法一定要对，与后台一致，区分大小写，不能为数组等，str1为形参的名字,str2为第二个形参的名字 
        data: "{'str1':'"+strMsg1+"','str2':'"+strMsg2+"'}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data) {
            //返回的数据用data.d获取内容 
            alert(data.d);
        },
        error: function(err) {
            alert(err);
        }
    });

　　//隐藏加载动画
    $("#pageloading").hide();
}

 

2、(同步)方法调用，可用于需要得到返回值是执行后续代码的前提

　　后台<C#>:

using System.Web.Script.Services; 
  
[WebMethod] 
public static string GetStr(string str1, string str2) 
{ 
    return str1 + str2; 
}
 
前台<JQuery>:

function Test(strMsg1,strMsg2) 
{

　var str = “”;
    $.ajax({
        type: "Post",
        url: "Demo.aspx/GetStr",
        async: false,
        //方法传参的写法一定要对，与后台一致，区分大小写，不能为数组等，str1为形参的名字,str2为第二个形参的名字 
        data: "{'str1':'"+strMsg1+"','str2':'"+strMsg2+"'}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data) {
            //返回的数据用data.d获取内容 
            str = data.d;
        },
        error: function(err) {
            alert(err);
        }
    });

　return str;