jQuery在第一个Ajax函数调用完全完成后继续另一 AJAX 函数

tvokkenx  于 2023-03-29  发布在  jQuery
关注(0)|答案(7)|浏览(235)

我在2个不同的函数中有2 AJAX 调用。我想使用。单击来调用这2个函数。func1是插入数据到数据库中,然后func2是检索数据,所以我的问题是如何等到func1完全完成,然后它只执行func2。
我试过.delay(),它可以工作,但我认为这是一个愚蠢的解决方案。

$("#updateLocation").click(function(e){
      e.preventdefault;
        func1();
        func2();
      });
      return false;
    });

    function func1(){
      $.ajax({
        url:'',
      });
});

    function func2(){
      $.ajax({
        url:'',
      });
});
bfhwhh0e

bfhwhh0e1#

三种方式:
在func1成功时调用func2:

function func1() {
       $.ajax({ ... }).done(func2);
    }

funky完成后使用Deferred API调用func2:

e.preventDefault();
    $.when(func1).then(func2);

使func1同步(不推荐):

function func1() {
       $.ajax({url: '', async: false});
    }
bwleehnv

bwleehnv2#

由于 AJAX 调用是异步的,因此应用程序在Ajax调用完成之前不会“暂停”,而只是立即开始下一个调用。
jQuery提供了一个处理程序,当调用成功时会调用它,如果在调用过程中发生错误,则会调用另一个处理程序。

$.ajax({
  url: 'ajax/test.html',
  success: function(data) {
    $('.result').html(data);
    alert('Load was performed.');
  },
  error :function(jqXHR, textStatus, errorThrown)
  {
     alert("something went wrong");
  }
});

您将需要从成功处理程序调用第二个 AJAX 函数。

9wbgstp7

9wbgstp73#

将func 2移动到func 1- AJAX -〉succes callback中

$("#updateLocation").click(function(e) {
    e.preventdefault;
    func1();
    //func2();
});
return false;
});

function func1() {
    $.ajax({
        url: '',
        success: function() { /* other stuff */
            func2();
        }
    });
});

function func2() {
    $.ajax({
        url: '',
    });
});
58wvjzkj

58wvjzkj4#

你可以设置“async”选项为false(对于第一 AJAX 调用)。
这意味着函数2将在函数1收到响应后被调用,即完成其执行。

function func1(){
      $.ajax({
        url:'',
        async: false
      });
});
qlzsbp2j

qlzsbp2j5#

在func1成功时调用fun2

function func1(){
  $.ajax({
    url:'',

    success:function(){
         func2();
    }  
  })
htrmnn0y

htrmnn0y6#

只需使用ajaxComplete函数,它有3个可选参数,在设置中,参数ajax action URL或者type我们接收到的数据,我们会根据这些数据设置一个条件。

$( document ).ajaxComplete(function( event, xhr, settings ) {
    if( settings.url != '/wp-admin/admin-ajax.php?action=get_location_form' && settings.type === 'POST') {
       get_location_form();      // replace function with your custom logic here
    }
});
5tmbdcev

5tmbdcev7#

你也可以像这样将函数作为参数传递:

var secondFunc = function (func) {

    //Do ajax req or smt
    func("answer", "params");

};
var firstFunc = function() {

    secondFunc(
        function (answerFromFunc2, paramsFromfunc2) {

            var a = answerFromFunc2;
            var b = paramsFromfunc2;

        }
    );

    //Do smt after the function request to the server is done
    var doSmt = "another func or variable";

};
firstFunc();

相关问题