确定 ajax 调用完成以运行另一个 ajax 调用答案

【问题标题】：Determine ajax call finished to run another ajax call确定 ajax 调用完成以运行另一个 ajax 调用
【发布时间】：2018-02-14 19:15:35
【问题描述】：

在我的项目中，我有一些选择选项组，它们根据以前的值加载 ajax 数据。现在，当我尝试将它们复制到另一个选择选项组时遇到问题。

这里是场景

parmanet address              Present Address
Division                      Division    
District                      District
Upzilla                       Upzilla
Union                         Union

它们都是选择字段，在选择每个字段后，下一个选择选项由 ajax 加载。我放了一个复选框，当用户单击该复选框时，parmanent 地址数据应复制到所有 ajax 调用的当前地址。

现在的问题是，jquery "val" 函数不起作用，因为它在从 ajax 加载数据之前运行。如果我将延迟设置为 100 毫秒，它可以工作，但这不是正确的方法。有没有更好的方法来解决这个问题？？

这是我更改除法以将ajax数据加载到除法时的代码，其他选项与此相同。

$('#divisions').change(function() {
    $("#villtable").hide();
    $("#villaddform").hide();
    $.ajax({
      type: 'post',
      url: 'GetDistricts',
      data: {
        get_option:this.value
      },
      success: function(response) {
        document.getElementById("districts").innerHTML=response;
      }
    });
  });

这就是我试图将数据复制到当前地址组...

$.when( $('.division-prese').val(divi).trigger('change').delay( 100 ) ).then(function() {
    $.when( $('.district-prese').val(dist).trigger('change').delay( 100 ) ).then(function() {
        $.when( $('.upazilla-prese').val(upaz).trigger('change').delay( 100 ) ).then(function() {
                        $('.union-prese').val(unio).trigger('change');
        });   
    });
});

我也试过“完成”，但还是不行。

【问题讨论】：

我对这个问题的最初想法是你不应该通过事件的生成来强制这个逻辑。鉴于您的用例，将 ajax 从更改事件中提取到它自己的方法中是有意义的。更改可以调用该方法，其他一些方法也可以调用它。另一种方法期望 ajax 方法返回它可以链接第二个 ajax 调用的承诺。这也将返回一个可以链接到第三个 ajax 调用的承诺。
如果可以的话，请给我一个例子兄弟。这对我很有帮助。

标签： javascript php jquery ajax function

【解决方案1】：

提取逻辑并在两个地方使用它的总体思路，其中一个执行 Promise 链接。

function loadDistricts ($divisions) {
	return $.ajax({
		type: 'post',
		url: 'GetDistricts',
		data: {
		  get_option: $divisions.val()
		},
		success: function(response) {
			$('#districts').html(response);
		}
	  });
}

//... other methods

var $divisions = $('#divisions');
var $districts = $('#districts');
var $upazillas = $('#upazillas');

$divisions.change(function() {
    $("#villtable").hide();
	$("#villaddform").hide();
	loadDistricts($divisions);
});

//... other change methods

$('.division-prese').val(divi);

loadDistricts($divisions).then(function(){
	$('.district-prese').val(dist);

	loadUpazillas($upazillas).then(function(){
		$('.upazilla-prese').val(upaz);

		//call next thing
	});
});

【讨论】：

非常感谢兄弟给予您宝贵的时间和清晰的想法。希望这能解决我的问题。我真的很感激。
完全没问题。

【解决方案2】：

尝试在通话前添加返回

$('#divisions').change(function() {
    $("#villtable").hide();
    $("#villaddform").hide();
      return $.ajax({
      type: 'post',
      url: 'GetDistricts',
      data: {
        get_option:this.value
      },
      success: function(response) {
        document.getElementById("districts").innerHTML=response;
      }
    });
  });

【讨论】：

jsfiddle.net/66dsLj0z/1 trigger() 返回它操作的 jquery 对象。延迟的将不会从该事件触发中返回。
你是对的@Taplar。有什么 api 可以代替延迟吗？