详谈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 陷阱 window全局对象
Nov 26 Javascript
jquery操作checked属性以及disabled属性的多种方法
Jun 20 Javascript
JavaScript中的toLocaleLowerCase()方法使用详解
Jun 06 Javascript
js实现兼容IE、Firefox的图片缩放代码
Dec 08 Javascript
JS平滑无缝滚动效果的实现代码
May 06 Javascript
jQuery.Ajax()的data参数类型详解
Jul 23 jQuery
探讨Vue.js的组件和模板
Oct 27 Javascript
vue页面跳转后返回原页面初始位置方法
Feb 11 Javascript
vue中改变滚动条样式的方法
Mar 03 Javascript
基于JS正则表达式实现模板数据动态渲染(实现思路详解)
Mar 07 Javascript
详解JavaScript 的执行机制
Sep 18 Javascript
vue-cli中实现响应式布局的方法
Mar 02 Vue.js
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
php xml留言板 xml存储数据的简单例子
2009/08/24 PHP
php中$_SERVER[PHP_SELF] 和 $_SERVER[SCRIPT_NAME]之间的区别
2009/09/05 PHP
基于php上传图片重命名的6种解决方法的详细介绍
2013/04/28 PHP
探讨fckeditor在Php中的配置详解
2013/06/08 PHP
php Xdebug的安装与使用详解
2013/06/20 PHP
javascript 放大镜效果js组件 qsoft.PopBigImage.v0.35 加入了chrome支持
2009/04/07 Javascript
DIV菜单层实现代码
2010/11/19 Javascript
jquery.boxy弹出框(后隔N秒后自动隐藏/自动跳转)
2013/01/15 Javascript
如何在JavaScript中实现私有属性的写类方式(二)
2013/12/04 Javascript
js中的cookie的读写操作示例详解
2014/04/17 Javascript
jQuery新的事件绑定机制on()示例应用
2014/07/18 Javascript
jQuery实现鼠标滚动图片延迟加载效果附源码下载
2016/06/28 Javascript
值得分享的bootstrap table实例
2016/09/22 Javascript
jQuery图片轮播(二)利用构造函数和原型创建对象以实现继承
2016/12/06 Javascript
JS闭包用法实例分析
2017/03/27 Javascript
微信小程序纯文本实现@功能
2020/04/08 Javascript
JS寄快递地址智能解析的实现代码
2020/07/16 Javascript
解决ant design vue中树形控件defaultExpandAll设置无效的问题
2020/10/26 Javascript
vue点击Dashboard不同内容 跳转到同一表格的实例
2020/11/13 Javascript
动态实现element ui的el-table某列数据不同样式的示例
2021/01/22 Javascript
Python黑帽编程 3.4 跨越VLAN详解
2016/09/28 Python
Python AES加密实例解析
2018/01/18 Python
Python字典深浅拷贝与循环方式方法详解
2020/02/09 Python
Python中if有多个条件处理方法
2020/02/26 Python
python使用列表的最佳方案
2020/08/12 Python
python调用百度API实现人脸识别
2020/11/17 Python
python 实现汉诺塔游戏
2020/11/28 Python
去加拿大的旅行和假期:Canadian Affair
2016/10/25 全球购物
幼教个人求职信范文
2013/12/02 职场文书
工程管理专业毕业生自荐信
2014/01/24 职场文书
优秀员工获奖感言
2014/03/01 职场文书
副总经理岗位职责
2014/03/16 职场文书
幼儿园小班教师寄语
2014/04/03 职场文书
优秀工会工作者事迹材料
2014/06/02 职场文书
授权收款委托书范本
2014/10/10 职场文书
运动会100米广播稿
2015/08/19 职场文书