详谈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 相关文章推荐
showModelessDialog()使用详解
Sep 07 Javascript
推荐10个超棒的jQuery工具提示插件
Oct 11 Javascript
javascript制作坦克大战全纪录(2)
Nov 27 Javascript
javascript实现PC网页里的拖拽效果
Mar 14 Javascript
jquery实现简单的banner轮播效果【实例】
Mar 30 Javascript
JavaScript 链式结构序列化详解
Sep 30 Javascript
Angular2 之 路由与导航详细介绍
May 26 Javascript
vue 搭建后台系统模块化开发详解
May 01 Javascript
微信小程序select下拉框实现源码
Nov 08 Javascript
js表达式与运算符简单操作示例
Feb 15 Javascript
如何实现小程序与小程序之间的跳转
Nov 04 Javascript
快速解决vue2+vue-cli3项目ie兼容的问题
Nov 17 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项目打包方法
2008/02/18 PHP
PHP中的函数嵌套层数限制分析
2011/06/13 PHP
巧用php中的array_filter()函数去掉多维空值的代码分享
2012/09/07 PHP
PHP中几种常见的超时处理全面总结
2012/09/11 PHP
php获取网页请求状态程序示例
2014/06/17 PHP
PHP容器类的两种实现方式示例
2019/07/24 PHP
Laravel 在views中加载公共页面的实现代码
2019/10/22 PHP
csdn 论坛技术区平均给分功能
2009/11/07 Javascript
超简单的jquery的AJAX用法
2010/05/10 Javascript
jquery获取焦点和失去焦点事件代码
2013/04/21 Javascript
jQuery获取iframe的document对象的方法
2014/10/10 Javascript
JQuery遍历json数组的3种方法
2014/11/08 Javascript
JavaScript数值千分位格式化的两种简单实现方法
2016/08/01 Javascript
详解js前端代码异常监控
2017/01/11 Javascript
npm国内镜像 安装失败的几种解决方案
2017/06/04 Javascript
基于JavaScript实现弹幕特效
2020/08/27 Javascript
解决Linux无法正常安装与卸载Node.js的方法
2018/01/19 Javascript
react redux入门示例
2018/04/19 Javascript
JavaScript中常见内置函数用法示例
2018/05/14 Javascript
jQuery实现表单动态加减、ajax表单提交功能
2018/06/08 jQuery
微信小程序webview与h5通过postMessage实现实时通讯的实现
2019/08/20 Javascript
浅谈Python 集合(set)类型的操作——并交差
2016/06/30 Python
python文件特定行插入和替换实例详解
2017/07/12 Python
python itchat实现微信自动回复的示例代码
2017/08/14 Python
Python模拟三级菜单效果
2017/09/11 Python
django 2.0更新的10条注意事项总结
2018/01/05 Python
python numpy元素的区间查找方法
2018/11/14 Python
解决pandas展示数据输出时列名不能对齐的问题
2019/11/18 Python
python下载卫星云图合成gif的方法示例
2020/02/18 Python
css3加js做一个简单的3D行星运转效果实例代码
2017/01/18 HTML / CSS
求职简历中的自我评价分享
2013/12/08 职场文书
校园主题婚礼活动策划方案
2014/09/15 职场文书
2014国庆节主题活动方案:快乐的国庆节
2014/09/16 职场文书
安装pytorch时报sslerror错误的解决方案
2021/05/17 Python
js实现模拟购物商城案例
2021/05/18 Javascript
UNION CREATIVE《Re:从零开始的异世界生活》雷姆手办
2022/03/20 日漫