详谈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 相关文章推荐
小米公司JavaScript面试题
Dec 29 Javascript
基于javascript实现全屏漂浮广告
Mar 31 Javascript
jQuery animate和CSS3相结合实现缓动追逐效果附源码下载
Apr 18 Javascript
vueJS简单的点击显示与隐藏的效果【实现代码】
May 03 Javascript
jQuery遍历节点树方法分析
Sep 08 Javascript
jQuery设置和获取select、checkbox、radio的选中值方法
Jan 01 Javascript
angularJS模态框$modal实例代码
May 27 Javascript
Node.js中环境变量process.env的一些事详解
Oct 26 Javascript
Webstorm2016使用技巧(SVN插件使用)
Oct 29 Javascript
Jquery实现无缝向上循环滚动列表的特效
Feb 13 jQuery
layui实现多图片上传并限制上传的图片数量
Sep 26 Javascript
js实现菜单跳转效果
Dec 11 Javascript
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
Windows IIS PHP 5.2 安装与配置方法
2009/06/08 PHP
Laravel+jQuery实现AJAX分页效果
2016/09/14 PHP
PHP正则删除HTML代码中宽高样式的方法
2017/06/12 PHP
IE autocomplete internet explorer's autocomplete
2007/06/30 Javascript
js 编写规范
2010/03/03 Javascript
jquery动态添加option示例
2013/12/30 Javascript
使用JQUERY进行后台页面布局控制DIV实现左右式
2014/01/07 Javascript
在JS中如何调用JSP中的变量
2014/01/22 Javascript
jquery跨域请求示例分享(jquery发送ajax请求)
2014/03/25 Javascript
js在IE与firefox的差异集锦
2014/11/11 Javascript
JavaScript判断是否为数组的3种方法及效率比较
2015/04/01 Javascript
jfinal与bootstrap的登录跳转实战演习
2015/09/22 Javascript
Node.js如何响应Ajax的POST请求并且保存为JSON文件详解
2017/03/10 Javascript
Node.js 中使用 async 函数的方法
2017/11/20 Javascript
详解Angular6学习笔记之主从组件
2018/09/05 Javascript
微信小程序实现消息框弹出动画
2020/04/18 Javascript
JavaScript 函数用法详解【函数定义、参数、绑定、作用域、闭包等】
2020/05/12 Javascript
PHP网页抓取之抓取百度贴吧邮箱数据代码分享
2016/04/13 Python
python实现聊天小程序
2018/03/13 Python
Python3之简单搭建自带服务器的实例讲解
2018/06/04 Python
python实现求两个字符串的最长公共子串方法
2018/07/20 Python
pandas的qcut()方法详解
2019/07/06 Python
Django配置MySQL数据库的完整步骤
2019/09/07 Python
Python 中@property的用法详解
2020/01/15 Python
python利用文件时间批量重命名照片和视频
2021/02/09 Python
使用css3制作动感导航条示例
2014/01/26 HTML / CSS
欧洲最大的婴幼儿服装及内衣公司:Petit Bateau(小帆船)
2016/08/16 全球购物
波兰香水和化妆品购物网站:Notino.pl
2017/11/07 全球购物
Android面试题附答案
2014/12/08 面试题
采购员岗位职责
2013/11/15 职场文书
工程采购员岗位职责
2014/03/09 职场文书
志愿者活动总结
2014/04/28 职场文书
平安家庭示范户事迹
2014/06/02 职场文书
求职自我评价范文100字
2014/09/23 职场文书
证券公司客户经理岗位职责
2015/04/09 职场文书
新郎父母婚礼答谢词
2015/09/29 职场文书