博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
关于js中Ajax的同步、异步使用
阅读量:6812 次
发布时间:2019-06-26

本文共 2232 字,大约阅读时间需要 7 分钟。

下面一个简单的例子,说明前后端交互中,Ajax同步和异步的使用

1、设置简单的一个div,包含触发事件

CompanyType()
@Html.DropDownList("companyList", ViewData["companyList"] as SelectList, new { @class = "select1 month", id = "branch", onchange = "CompanyType();Time1();" })

2、写一个Ajax,调用后台的方法

Basic,方法名
GetCompanyNatureId,,,,,url的写法有多种,也可以写成其他形式的url
async: false, //这个表示是否同步,false是同步,,,,true是异步,,,,,如果不写这个,默认为异步,,,注意点!!! data: { companyId: companyId }, //data是要传的参数,冒号前面是参数名,务必和后台方法体的参数名保持一致,后面是要传的参数值 success: function (data) { $("#companyType").val(data); } //这个data是后台接口调用成功之后返回的参数,需要注意的是,如果掉成功之后在这个function函数里面要执行这样的方法,并使用返回参数,那么后台接口的返回值类型要设置字符串类型,具体看下方代码 }); } 
public string GetCompanyNatureId(string CompanyId)        {            return business.GetCompanyNatureId(CompanyId);        }
public string GetCompanyNatureId(string CompanyId)        {            string CompanyNatureId = "";            CompanyMdl subCompany = new core.CompanyMdl { CompanyID = CompanyId };            BaseResponse
> RsCompany = new BaseResponse
>(); RsCompany = data.GetSubCompanyList(subCompany); List
companyList = new List
(); companyList = RsCompany.Data; if (companyList.Count > 0) { CompanyNatureId = companyList[0].CompanyNatureId; } return CompanyNatureId; }
string apiUrl = System.Configuration.ConfigurationManager.AppSettings["APIUrl"].ToString(); //api地址  //这个是调用接口的数据 public BaseResponse
> GetSubCompanyList(CompanyMdl subCompany) { BaseResponse
> Response = new BaseResponse
>(); try { Response = SendHttpRequest
>>(apiUrl + "api/Bx/GetSubCompanyList",GetJsonFromObj
(subCompany), CommonHttpWebMethodEnum.POST); } catch (Exception ex) { throw ex; } return Response; }

注意一下红色标识!!!

我的触发事件中有两个函数的调用:CompanyType();Time1();

那么,同步和异步究竟是怎么体现的呢?

第一种情况:

我的

CompanyType()中有Ajax的调用,而且返回值要在
Time1()函数中用到,所以,
我需要先调用完后台接口之后,再执行
Time1()函数,这就要用同步,,,,Ajax和后台接口执行完了之后,再走下一个函数; 第二种情况:
CompanyType()和
Time1(),相互独立,没有交叉的引用,那么,我可以选择使用异步,这两个函数先后执行完之后,Ajax调用的后台接口再去执行,这样表达在页面上,执行效率就会快很多。

转载于:https://www.cnblogs.com/jiuyueBlog/p/10183795.html

你可能感兴趣的文章
好的文章万里挑一
查看>>
JavaScript 继承
查看>>
ol3 Demo1 ----加载geoserver发布的地图数据
查看>>
Base64加密
查看>>
复选框、单选框 jquery判断是否选中Demo
查看>>
C# 浅拷贝与深拷贝(复制)
查看>>
Zephyr学习(一)Zephyr介绍
查看>>
springboot创建项目
查看>>
VS2012发布网站IIS配置
查看>>
软考:招标投标法(1)2-3分
查看>>
2019全球区块链杭州高峰论坛将于5月17日举办!
查看>>
Spring知识点总结
查看>>
2018年全国卷Ⅰ卷理科数学图片版
查看>>
CF915E Physical Education Lessons(珂朵莉树)
查看>>
bzoj3550: [ONTAK2010]Vacation(单纯形法+线性规划)
查看>>
nodejs.md
查看>>
opencv(10)图像变换之边缘检测
查看>>
百度地图的简单使用
查看>>
15个简单算法题
查看>>
JSTL 核心标签库 使用(C标签)
查看>>