管理对PHP脚本的多个AJAX调用

我有一组5个HTML下拉列表，用作筛选从mySQL数据库返回的结果。这三个相关过滤器分别用于省、地区和城市选择

我有三个职能：

findSchools，它在任何标记为CSS class.filter的过滤器发生更改时运行，并通过AJAX从PHP脚本获取结果。完成后，将调用另外两个函数

changeRegionOptions，它在更改省过滤器时，使用与第一个函数相同的方法更新可用选项，但发布到不同的脚本

changeCityOptions，在区域过滤器更改时运行，并再次使用相同的方法更新选项

问题是，由于我希望这些AJAX函数同时运行，而且它们本质上是异步运行的，所以我尝试在何时使用$来控制函数的执行，但这并不能解决问题

函数运行，但区域和城市过滤器返回空无选项；FireBug报告显示绝对没有输出，即使POST请求通过了。filter_province的posted参数正常发送，但region的参数在末尾被截断-它作为filter_region=发送，没有传递任何值。所以我想我的逻辑是错误的。代码如下：

// When any of the filters are changed, let's query the database...
$("select.filter").change(function() {
    findSchools();
});

  // First, we see if there are any results...
      function findSchools() {

          var sch_province = document.filterform.filter_province.value;
          var sch_region = document.filterform.filter_region.value;
          var sch_city = document.filterform.filter_city.value;
          var sch_cat = document.filterform.filter_category.value;
          var sch_type = document.filterform.filter_type.value;

          $.post("fetch_results.php",
          { filter_province : sch_province,
            filter_region : sch_region,
            filter_city : sch_city,
            filter_category : sch_cat,
            filter_type : sch_type },

            function(data) {

              $("#results").html("");
              $("#results").hide();
              $("#results").html(data);
              $("#results").fadeIn(600);
            }
          );

    // Once the results are fetched, we want to see if the filter they changed
       was the one for Province, and if so, update the Region and City options
        to match that selection...

            $("#filter_province").change(function() {

                $.when(findSchools())
                .done(changeRegionOptions());

                $.when(changeRegionOptions())
                .done(changeCityOptions());
        });
  };

这只是我试图解决它的方法之一；我尝试使用IF语句，并尝试在findSchools之后直接在general select.filter.change函数内调用函数，但它们都返回相同的结果

---

这方面的任何帮助都将是巨大的

您需要将async改为false。之后，您的代码将逐行执行

例如，在调用$.post之前

$.ajaxSetup({async:false});

---

试试这个。希望这是你所期待的

我已经读了好几遍了，不明白为什么每次一个选项被更改时都需要对所有选项进行更改。逻辑似乎有缺陷。在中创建一个简化的演示我创建了一个稍加修改的JSFIDLE演示：如果只更改了一个选项就更改了所有的选择，那么您指的是select.filter.change触发函数，它用于查询和返回数据库中的结果，而不是其他。它所在的页面是搜索结果页面，过滤器用于缩小搜索结果的范围。它获取所有选择的值并将它们发送到PHP脚本，然后PHP脚本使用这些值构建并执行mySQL查询，以返回符合这些条件的学校列表。然后它被发送回同一个页面，并立即更新，无需重新加载页面。在谷歌上搜索jquery层叠选择或jquery多重选择。您的逻辑仍然存在缺陷，并且有教程和插件可以让您更轻松地完成此任务。当只选择一个省时，您真的需要一个省内所有学校的列表吗？？如果是这样的话，为什么要回到服务器上，一旦有了数据就不在本地存储呢？谢谢您的反馈。我重写了它的大部分内容，现在它似乎工作正常，将async设置为false，一次单击就放弃了对所有下拉列表的更改。问题是我遇到了三个AJAX请求的竞争情况：在更改region下拉选项以匹配省之前，它会发送一个与省不匹配的region值，这会产生奇怪的结果，如filter_province=1，但filter_region=16不匹配；这当然会抛出我的“未找到结果”错误。