详谈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 相关文章推荐
JS模拟多线程
Feb 07 Javascript
Prototype 学习 工具函数学习($A方法)
Jul 12 Javascript
jquery 跳到顶部和底部动画2句代码简单实现
Jul 18 Javascript
JavaScript中window.showModalDialog()用法详解
Dec 18 Javascript
Bootstrapvalidator校验、校验清除重置的实现代码(推荐)
Sep 28 Javascript
JS实现的四级密码强度检测功能示例
May 11 Javascript
Angular2中如何使用ngx-translate进行国际化
May 21 Javascript
微信小程序 websocket 实现SpringMVC+Spring+Mybatis
Aug 04 Javascript
jQuery插件实现弹性运动完整示例
Jul 07 jQuery
Vue实例的对象参数options的几个常用选项详解
Nov 08 Javascript
js实现拾色器插件(ColorPicker)
May 21 Javascript
vue组件是如何解析及渲染的?
Jan 13 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
基于文本的访客签到簿
2006/10/09 PHP
PHP 无限分类三种方式 非函数的递归调用!
2011/08/26 PHP
php Imagick获取图片RGB颜色值
2014/07/28 PHP
html中table数据排序的js代码
2011/08/09 Javascript
Javascript代码在页面加载时的执行顺序介绍
2013/05/03 Javascript
JQuery的自定义事件代码,触发,绑定简单实例
2013/08/01 Javascript
关于js数组去重的问题小结
2014/01/24 Javascript
浅谈javascript中replace()方法
2015/11/10 Javascript
JQuery实现的按钮倒计时效果
2015/12/23 Javascript
js添加绑定事件的方法
2016/05/15 Javascript
AngularJS基础 ng-keyup 指令简单示例
2016/08/02 Javascript
JS实现的模仿QQ头像资料卡显示与隐藏效果
2017/04/07 Javascript
javascript 日期相减-在线教程(附代码)
2017/08/17 Javascript
微信小程序实现banner图轮播效果
2020/06/28 Javascript
写一个Vue Popup组件
2019/02/25 Javascript
JavaScript:ES2019 的新特性(译)
2019/08/08 Javascript
Python高效编程技巧
2013/01/07 Python
对pandas中apply函数的用法详解
2018/04/10 Python
如何利用python查找电脑文件
2018/04/27 Python
Gauss-Seidel迭代算法的Python实现详解
2019/06/29 Python
设置jupyter中DataFrame的显示限制方式
2020/04/12 Python
numpy库ndarray多维数组的维度变换方法(reshape、resize、swapaxes、flatten)
2020/04/28 Python
canvas探照灯效果的示例代码
2018/11/30 HTML / CSS
毕业生动漫设计求职信
2013/10/11 职场文书
大学生关于奋斗的演讲稿
2014/01/09 职场文书
文明家庭先进事迹材料
2014/05/14 职场文书
纪律教育学习月活动总结
2014/08/27 职场文书
毕业生实习期转正自我鉴定
2014/09/26 职场文书
毕业实习证明(4篇)
2014/10/28 职场文书
十岁生日答谢词
2015/01/05 职场文书
施工员岗位职责
2015/02/10 职场文书
最感人的道歉情书
2015/05/12 职场文书
困难补助申请报告
2015/05/19 职场文书
婚礼男方父母答谢词
2015/09/29 职场文书
html+css合并表格边框的示例代码
2021/03/31 HTML / CSS
Go语言实现Base64、Base58编码与解码
2021/07/26 Golang