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

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

CompanyType()
<div>
<input type="hidden" id="branchHidden" name="branchHidden" value="" />
<input type="hidden" id="companyType" name="companyType" value="" />
@Html.DropDownList("companyList", ViewData["companyList"] as SelectList, new { @class = "select1 month", id = "branch", onchange = "CompanyType();Time1();" })
</div>

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

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

注意一下红色标识!!!

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

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

第一种情况:

我的

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

关于js中Ajax的同步、异步使用的更多相关文章

  1. JS中Ajax的同步和异步

    ajax同步 : 意味着此时请求Server后,JS代码不再继续执行,等待Server返回后才继续往下执行. ajax异步 : 意味着此时请求Server后,JS代码继续执行,不管Server什么时候 ...

  2. js中ajax连接服务器open函数的另外两个默认参数get请求和默认异步(open的post方式send函数带参数)(post请求和get请求区别:get:快、简单 post:安全,量大,不缓存)(服务器同步和异步区别:同步:等待服务器响应当中浏览器不能做别的事情)(ajax和jquery一起用的)

    js中ajax连接服务器open函数的另外两个默认参数get请求和默认异步(open的post方式send函数带参数)(post请求和get请求区别:get:快.简单 post:安全,量大,不缓存)( ...

  3. prototype.js 和 jQuery.js中 ajax 的使用

    这次还是prototype.js 和 jQuery.js冲突的问题,前面说到过解决办法http://www.cnblogs.com/Joanna-Yan/p/4836252.html,以及上网说的大部 ...

  4. js中ajax如何解决跨域请求

    js中ajax如何解决跨域请求,在讲这个问题之前先解释几个名词 1.跨域请求 所有的浏览器都是同源策略,这个策略能保证页面脚本资源和cookie安全 ,浏览器隔离了来自不同源的请求,防上跨域不安全的操 ...

  5. js中ajax的异步性

    最近项目里遇到ajax异步性的问题,简化后的代码如下: function ajaxGetEvents(calendarView, time) { var year = time.getFullYear ...

  6. js中ajax异步导致的一些问题

    问题1:ajax默认是异步,所以在ajax中对外面定义的变量赋值,不能正确赋值 $("form").submit( var flag; $.ajax({ type: 'GET', ...

  7. js中Ajax工作原理(转)

    在写这篇文章之前,曾经写过一篇关于AJAX技术的随笔,不过涉及到的方面很窄,对AJAX技术的背景.原理.优缺点等各个方面都很少涉及null.这次写这篇文章的背景是因为公司需要对内部程序员做一个培训.项 ...

  8. js的线程和同步异步以及console.log机制

    项目上线了,闲下来就写写东西吧.积累了好多东西都没有做笔记~挑几个印象深刻的记录一下吧. js的同步异步以及单线程问题: 都知道单线程是js的一大特性.但是通常io(ajax获取服务器数据).用户/浏 ...

  9. jQuery基础(Ajax,load(),getJSON(),getScript(),post(),ajax(),同步/异步请求数据)

    1.使用load()方法异步请求数据   使用load()方法通过Ajax请求加载服务器中的数据,并把返回的数据放置到指定的元素中,它的调用格式为:   load(url,[data],[callba ...

随机推荐

  1. Servlet中如何获取用户提交的查询参数或表单数据?

    ①HttpServletRequest的getParameter()方法. ②HttpServletRequest的getParameterValues()方法. ③HttpServletReques ...

  2. find和grep技巧

    1. find ./ -name "*streaming*"  查找文件 2.  grep -r KUBE_LOGTOSTDERR /etc/kubernetes/*  查找内容

  3. 【leetcode】207. Course Schedule

    题目如下: There are a total of n courses you have to take, labeled from 0 to n-1. Some courses may have ...

  4. linux之-mysql数据库2

    1.新建数据库 语句格式为 CREATE DATABASE <数据库名字>;,(注意不要漏掉分号 ;),前面的 CREATE DATABASE 也可以使用小写,具体命令为: 2.连接数据库 ...

  5. python基础三(深浅拷贝)

    1.赋值操作 list_1 = [1,2,3,['barry','Jerry']] list_2 = list_1 list_1[0] = 111 print(list_1) # [111, 2, 3 ...

  6. spring 数据库字段映射

    当有复杂名称字段时: 在repository中写代码字段名 List<Grid> findByLocIsWithin(GeoJsonPolygon boundary); 可以添加field ...

  7. 使用密码登陆Amazon EC2

    用的是亚马逊推荐的系统:Amazon Linux AMI 2015.09.1 (HVM) 创建instance后,会有一个pem的key使用该密钥登陆到服务器上后,默认用户名为 ec2-user 直接 ...

  8. 百度之星资格赛2018B题-子串查询

    子串查询 题目 度度熊的字符串课堂开始了!要以像度度熊一样的天才为目标,努力奋斗哦! 为了检验你是否具备不听课的资质,度度熊准备了一个只包含大写英文字母的字符串 A[1,n]=a1a2⋯an,接下来他 ...

  9. 5.如何使用jmeter参数话

    参数化:简单的来理解一下,我们录制了一个脚本,这个脚本中有登录操作,需要输入用户名和密码,假如系统不允许相同的用户名和密码同时登录,或者更好的模拟多个用户来登录系统.这个时候就需要对用户名和密码进行参 ...

  10. Java异常抛出

    如果要在一段代码中抛出一个已检查的异常,有两个选择: 使用try-catch块处理已检查的异常. 在方法/构造函数声明中用throws子句指定. 语法 throws子句的一般语法是: 1 2 3 &l ...