关于js中Ajax的同步、异步使用
下面一个简单的例子,说明前后端交互中,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的同步、异步使用的更多相关文章
- JS中Ajax的同步和异步
ajax同步 : 意味着此时请求Server后,JS代码不再继续执行,等待Server返回后才继续往下执行. ajax异步 : 意味着此时请求Server后,JS代码继续执行,不管Server什么时候 ...
- js中ajax连接服务器open函数的另外两个默认参数get请求和默认异步(open的post方式send函数带参数)(post请求和get请求区别:get:快、简单 post:安全,量大,不缓存)(服务器同步和异步区别:同步:等待服务器响应当中浏览器不能做别的事情)(ajax和jquery一起用的)
js中ajax连接服务器open函数的另外两个默认参数get请求和默认异步(open的post方式send函数带参数)(post请求和get请求区别:get:快.简单 post:安全,量大,不缓存)( ...
- prototype.js 和 jQuery.js中 ajax 的使用
这次还是prototype.js 和 jQuery.js冲突的问题,前面说到过解决办法http://www.cnblogs.com/Joanna-Yan/p/4836252.html,以及上网说的大部 ...
- js中ajax如何解决跨域请求
js中ajax如何解决跨域请求,在讲这个问题之前先解释几个名词 1.跨域请求 所有的浏览器都是同源策略,这个策略能保证页面脚本资源和cookie安全 ,浏览器隔离了来自不同源的请求,防上跨域不安全的操 ...
- js中ajax的异步性
最近项目里遇到ajax异步性的问题,简化后的代码如下: function ajaxGetEvents(calendarView, time) { var year = time.getFullYear ...
- js中ajax异步导致的一些问题
问题1:ajax默认是异步,所以在ajax中对外面定义的变量赋值,不能正确赋值 $("form").submit( var flag; $.ajax({ type: 'GET', ...
- js中Ajax工作原理(转)
在写这篇文章之前,曾经写过一篇关于AJAX技术的随笔,不过涉及到的方面很窄,对AJAX技术的背景.原理.优缺点等各个方面都很少涉及null.这次写这篇文章的背景是因为公司需要对内部程序员做一个培训.项 ...
- js的线程和同步异步以及console.log机制
项目上线了,闲下来就写写东西吧.积累了好多东西都没有做笔记~挑几个印象深刻的记录一下吧. js的同步异步以及单线程问题: 都知道单线程是js的一大特性.但是通常io(ajax获取服务器数据).用户/浏 ...
- jQuery基础(Ajax,load(),getJSON(),getScript(),post(),ajax(),同步/异步请求数据)
1.使用load()方法异步请求数据 使用load()方法通过Ajax请求加载服务器中的数据,并把返回的数据放置到指定的元素中,它的调用格式为: load(url,[data],[callba ...
随机推荐
- ThinkPHP5.1x 中间件实现原理
ThinkPHP5.1x的中间件,其核心还是闭包函数的应用,来实现“责任链”模式: 模拟代码: <?php //模拟的控制器 class Controller { public function ...
- 五、bootstrap-fileinput
一.bootstrap-fileinput <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- java应用之solr入门篇
前言 solr是apache项目的一款全文搜索应用. 官方文档http://lucene.apache.org/solr/guide/6_6/ 入门流程 1.安装 ---> 2.启动 - ...
- swap的几点理解
一.什么是swap space(交换分区)? 在Linux系统中,当物理内存满了才使用Swap空间.当系统需要更多的内存资源,并且物理内存已经满了,此时,内存中那些不活跃的pages被移动(move) ...
- go(一)基础知识
一.第一个程序 基本程序结构 package main // 包 import "fmt" // 引入依赖代码 // 功能实现 func main() { fmt.Println( ...
- ajax中json格式数据如何朝后端发送数据
- 外部表及oracle数据库内存
create table alert1 (log varchar2(1000))2 organization external3 (type oracle_loader4 default direct ...
- linux基础知识汇总(三)-vmware下ubuntu上网配置
方式1 : 使用NAT共享IP的方式.使用这种方式什么都不用设置就可以在ubuntu中上网冲浪了. 备注: 1.如果ubuntu还不能上网的话,可以到我们的电脑的“服务”里面,检查“VMware NA ...
- tidb入门
由于目前的项目把mysql换成了TiDb,所以特意来了解下tidb.其实也不能说换,由于tidb和mysql几乎完全兼容,所以我们的程序没有任何改动就完成了数据库从mysql到TiDb的转换,TiDB ...
- 70、saleforce的Json输出
List<Merchandise__c> merchandise = [select Id,Name,Price__c,Quantity__c from Merchandise__c li ...