是否有一种方法可以在启动同步ajax调用之前强制执行javascript代码

Is there a way to enforce javascript code is executed before launching a synchronous ajax call

本文关键字：调用 ajax 同步 启动 代码 javascript 强制执行 方法 一种 是否      更新时间：2023-09-26

我真的不知道我做错了什么。我得到了一些javascript (jQuery)，像这样:

function myFunc(){
    $('.wait').addClass('waiting');
    console.log('wait');
    var r = $.ajax({type: "GET", url: "my_URL", async: false}).responseText;
    $('.wait').removeClass('waiting');
    console.log('stop wait');
    return r;
}

我的问题是，类"等待"没有添加，而做这个调用…我的意思是，当我调用我的函数时，我得到一个div它应该出现在开始然后被移除但它没有出现。一切似乎都有条不紊地进行着。当我试图在没有

的情况下执行它时，我得到了ajax调用的结果。
$('.wait').removeClass('waiting');

我的div显示，但只有在我得到ajax响应…我试图对请求进行计时，它大约需要2秒…所以我真的不知道为什么会发生这种情况。

可能与同步ajax调用有关吗?由于JavaScript是一种过程性语言，我认为类的添加应该在登录到控制台和开始ajax调用之前完成，但是我得到响应后得到了所有的修改(即使在JavaScript控制台中，所有内容都附加在ajax调用之后)。

任何帮助都会很好!

函数运行时浏览器中不会发生任何事情，因此需要使用异步代码以便浏览器可以更新元素。您可以使用setTimeout方法在浏览器有机会更新后运行其余的代码。

由于代码是异步的，因此无法从函数返回值，因为函数在AJAX调用之前已经存在。使用回调函数获取值:

function myFunc(callback){
  $('.wait').addClass('waiting');
  window.setTimeout(function(){
    var r = $.ajax({type: "GET", url: "my_URL", async: false}).responseText;
    $('.wait').removeClass('waiting');
    callback(r);
  }, 0);
}

由于必须使用异步代码来更新元素，因此也可以将AJAX调用设置为异步的，这样可以防止浏览器在请求期间无响应:

function myFunc(callback){
  $('.wait').addClass('waiting');
  $.ajax({type: "GET", url: "my_URL", success: function(data){
    $('.wait').removeClass('waiting');
    callback(data);
  }});
}

async版本。您应该传递回调函数，该函数将被调用并考虑结果。在特定情况下return data是错误的。

function myFunc() {
    $('.wait').addClass('waiting');
    console.log('wait');
    var r = $.ajax({
        type: "GET",
        url: "my_URL",
        async: true,
        success: function (data) {
            $('.wait').removeClass('waiting');
            console.log('stop wait');
            return data;
        }
    })
}
相关文章：