详谈Ajax请求中的async:false/true的作用(ajax 在外部调用问题)


Posted in Javascript onFebruary 10, 2017

test.html

<a href="javascript:void(0)" rel="external nofollow" onmouseover="testAsync()">
asy.js

function testAsync(){
  var temp;
  $.ajax({
    async: false,  //同步请求
    type : "GET",
    url : 'tet.php',
    complete: function(msg){
      alert('complete');
    },
    success : function(data) {
      alert('success');
      temp=data;
    }
  });
  alert(temp);
}

 

tet.php

<?php
  echo "here is html code";
  sleep(5);
?>

说明

async: false,(默认是true);

如上:false为同步,这个 testAsync()方法中的Ajax请求将整个浏览器锁死,只有tet.php执行结束后,才可以执行其它操作。

当async: true 时,ajax请求是异步的。

但是其中有个问题:testAsync()中的ajax请求和其后面的操作是异步执行的,那么当tet.php还未执行完,就可能已经执行了 ajax请求后面的操作,如: alert(temp+'   end'); 然而,temp这个数据是在ajax请求success后才赋值的,结果,输出时会为空。

----------------------------------------------------

由于ajax默认为异步调用,所以很少能直接拿到ajax的返回值。但有时候由于业务需要还必须要通过ajax来拿,那么我这里提供两种方案。

具体方法:

1、就像通过设置async:false让其异步变同步;

2、可以将接下来需要使用到的参数在success之内执行。

这两种方案,你根据你项目的具体实际选择一个。

使用第一种相对来讲,假如你对性能要求不是太大可以选择。

以上这篇详谈Ajax请求中的async:false/true的作用(ajax 在外部调用问题)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
一页面多XMLHttpRequest对象
Jan 22 Javascript
javascript 二进制运算技巧解析
Nov 27 Javascript
JS实现鼠标箭头变成一个燃烧烛光效果的方法
Feb 28 Javascript
jQuery实现鼠标选文字发新浪微博的方法
Apr 02 Javascript
jQuery中Ajax全局事件引用方式及各个事件(全局/局部)执行顺序
Jun 02 Javascript
javascript简单进制转换实现方法
Nov 24 Javascript
Vue实例简单方法介绍
Jan 20 Javascript
从源码看angular/material2 中 dialog模块的实现方法
Oct 18 Javascript
JS使用Date对象实时显示当前系统时间简单示例
Aug 23 Javascript
javascript实现图片轮播代码
Jul 09 Javascript
JS实现电商商品展示放大镜特效
Jan 07 Javascript
jQuery HTML css()方法与css类实例详解
May 20 jQuery
jQuery移除或禁用html元素点击事件常用方法小结
Feb 10 #Javascript
jQuery基于Ajax方式提交表单功能示例
Feb 10 #Javascript
Bootstrap轮播图学习使用
Feb 10 #Javascript
微信小程序模板之分页滑动栏
Feb 10 #Javascript
三种方式实现瀑布流布局
Feb 10 #Javascript
vuejs通过filterBy、orderBy实现搜索筛选、降序排序数据
Oct 26 #Javascript
Ionic+AngularJS实现登录和注册带验证功能
Feb 09 #Javascript
You might like
Ajax+PHP 边学边练之四 表单
2009/11/27 PHP
thinkphp路由规则使用示例详解和伪静态功能实现(apache重写)
2014/02/24 PHP
PHP快速排序quicksort实例详解
2016/09/28 PHP
golang实现php里的serialize()和unserialize()序列和反序列方法详解
2018/10/30 PHP
workerman结合laravel开发在线聊天应用的示例代码
2018/10/30 PHP
Laravel框架Eloquent ORM修改数据操作示例
2019/12/03 PHP
JavaScript中的new的使用方法与注意事项
2007/05/16 Javascript
JQuery index()方法使用代码
2010/06/02 Javascript
深入解析Javascript闭包的功能及实现方法
2016/07/10 Javascript
HTML页面,测试JS对C函数的调用简单实例
2016/08/09 Javascript
浅谈Web页面向后台提交数据的方式和选择
2016/09/23 Javascript
AngularJS 应用身份认证的技巧总结
2016/11/07 Javascript
详解如何在Angular中快速定位DOM元素
2017/05/17 Javascript
JQuery EasyUI 结合ztrIee的后台页面开发实例
2017/09/01 jQuery
ES6中Array.includes()函数的用法
2017/09/20 Javascript
js遍历添加栏目类添加css 再点击其它删除css【推荐】
2018/06/12 Javascript
js中this的指向问题归纳总结
2018/11/28 Javascript
微信小程序实现页面浮动导航
2019/01/28 Javascript
vue.js 2.*项目环境搭建、运行、打包发布的详细步骤
2019/05/01 Javascript
jQuery 隐藏/显示效果函数用法实例分析
2020/05/20 jQuery
jQuery实现动态加载瀑布流
2020/09/01 jQuery
Python中的random()方法的使用介绍
2015/05/15 Python
python中的错误处理
2016/04/10 Python
Python中类的初始化特殊方法
2017/12/01 Python
TF-IDF与余弦相似性的应用(一) 自动提取关键词
2017/12/21 Python
Python实现PS图像明亮度调整效果示例
2018/01/23 Python
python线程池threadpool使用篇
2018/04/27 Python
Python中利用xpath解析HTML的方法
2018/05/14 Python
python爬虫豆瓣网的模拟登录实现
2019/08/21 Python
关于Python 常用获取元素 Driver 总结
2019/11/24 Python
匈牙利墨盒和碳粉购买网站:CDRmarket
2018/04/14 全球购物
Currentbody西班牙:美容仪专家
2019/09/28 全球购物
100%羊绒:NakedCashmere
2020/08/26 全球购物
linux面试题参考答案(8)
2016/04/19 面试题
共青团优秀团员申请书(范文)
2019/08/15 职场文书
Python激活Anaconda环境变量的详细步骤
2021/06/08 Python