zoukankan      html  css  js  c++  java
  • 如何等待ajax完成再执行相应操作

    ajax广泛应用于异步请求,对于大多数业务来说,这是十分方便的,但对于一些特殊的业务,ajax的异步性会起到相反的作用。

    例如在ajax请求成功后,后续的操作需要依赖ajax执行成功后的相应操作。

    // 声明一个表示状态的全局变量 status
    var status = false;
    // ajax
    $.ajax({
        url:"/checkUsername",
        type:"post",
        success:function(){
            status = true;  
    }  
    });
    
    // 根据 status 的状态 进行后续操作
    function(){
      if(status){
        // 后续操作
    }  
    }

    以上代码对于不是很清楚ajax运行原理的朋友来说,看似没什么毛病,但其实 status 的值在ajax 请求成功之后进行 if 判断的时候值仍然为 false。

    因为 ajax 有个 async 属性,该属性默认为 true,表示 ajax 异步执行,而在进行 if 判断的时候,ajax 的异步执行还没完成,因此 status 的值仍然是 false。

    若要保证 status 的值是在 ajax 执行完成之后的最终值,有两种办法:

    1、将 ajax 的 async 属性设置为 false,表示 ajax 同步执行。

    // 声明一个表示状态的全局变量 status
    var status = false;
    // ajax
    $.ajax({
        url:"/checkUsername",
        type:"post",
        // ajax 同步执行
        async:false,
        success:function(){
            status = true;  
    }  
    });
    
    // 根据 status 的状态 进行后续操作
    function(){
      if(status){
        // 后续操作
    }  
    }

    但是这种方式在有些情况下并不好用。推荐第二种方式。

    2、利用 jquery 的 when().done 函数 等待 ajax 执行结束之后再进行后续操作。

    // 声明一个表示状态的全局变量 status
    var status = false;
    // ajax
    myajax = $.ajax({
        url:"/checkUsername",
        type:"post",
        success:function(){
            status = true;  
    }  
    });
    
    // 根据 status 的状态 进行后续操作
    function(){
      // myajax 请求完毕时执行
      $.when(myajax).done(function(){
          if(status){
            // 后续操作
          }  
        }) ;
    }

    此时的 status 是在 ajax 执行完成后被重新赋值后的 status ,值为 true。

  • 相关阅读:
    dayfunctools.weps 定义函数装饰器
    python3之concurrent.futures一个多线程多进程的直接对接模块,python3.2有线程池了
    python的类的super()
    django的admin
    python的单例模式
    git指南
    django创建验证码
    Django model对象接口
    Go语言基础
    迭代器&迭代对象&生成器
  • 原文地址:https://www.cnblogs.com/elementplay/p/10789600.html
Copyright © 2011-2022 走看看