Javascript 第二个下拉列表取决于我的第一个下拉列表。怎么用？

我的程序中有两个下拉列表，我希望它是这样的：

• 我有一个员工列表，显示/填充该列表并将其放入 在我的第一个下拉列表中
• 第二，当我选择“弗朗西斯”时，第二个下拉列表将 当我选择另一名员工时，仅为Francis等提供价值/事件

我认为第一个下拉列表是正确的，但我想得到它的值，并将其放入第二个下拉列表中WHERE子句的SQL语句中。怎么做

客户名称：
选择
调查：
选择
对第二个选择执行ajax请求：

为ajax请求创建一个php文件
html:


客户名称：
选择
调查：
选择

ajax.php

 <?php
     include("alqdb.php");
     $result=mysqli_query($con, "SELECT EventTitle FROM events WHERE ClientName = '"$_GET['cname']"'");
     while($row=mysqli_fetch_assoc($result)){
         echo "<option>".$row["EventTitle"]."</option>";
     }
 ?>

对第二个选择执行ajax请求：

为ajax请求创建一个php文件
html:


客户名称：
选择
调查：
选择

ajax.php

 <?php
     include("alqdb.php");
     $result=mysqli_query($con, "SELECT EventTitle FROM events WHERE ClientName = '"$_GET['cname']"'");
     while($row=mysqli_fetch_assoc($result)){
         echo "<option>".$row["EventTitle"]."</option>";
     }
 ?>

为什么要包含两次alqdb.php？？有两种方法可以做到这一点1一个简单的get请求，2。ajax请求它是针对我的数据库的，我想如果我没有包含alqdb.php，我会得到一个错误。顺便说一句，你能给我看一些代码吗？谢谢！：）为什么要包含两次alqdb.php？有两种方法可以做到这一点1一个简单的get请求，2。ajax请求它是针对我的数据库的，我想如果我没有包含alqdb.php，我会得到一个错误。顺便说一句，你能给我看一些代码吗？谢谢！：）谢谢你，马达林，但它不起作用。我删除了第二个下拉php代码并按照您所说的做。我用你给我的代码创建了一个php文件。js文件怎么样？我把它放在我发布的代码的alqbilling.php（文件名）内的标记中。：）没关系，Madalin，我真的很感谢你帮助我的努力。哈哈.）是否可以使用POST？是，将类型更改为POST，并在ajax.phpSlr Madalin中使用$\u POST，但它不起作用：（我尝试了您的方法，但当我选择Francis时，第二个下拉列表将不会显示任何内容。我想显示Francis保留该事件时的事件，以此类推。）xhr请求是否在选择更改时发生？谢谢Madalin，但它不起作用。我删除了第二个下拉php代码并按照您所说的做。我用你给我的代码创建了一个php文件。js文件怎么样？我把它放在我发布的代码的alqbilling.php（文件名）内的标记中。：）没关系，Madalin，我真的很感谢你帮助我的努力。哈哈.）是否可以使用POST？是，将类型更改为POST，并在ajax.phpSlr Madalin中使用$\u POST，但它不起作用：（我尝试了您的方法，但当我选择Francis时，第二个下拉列表将不会显示任何内容。我想显示Francis保留该事件时的事件，依此类推。：）xhr请求是否在选择更改时发生？
 <?php
     include("alqdb.php");
     $result=mysqli_query($con, "SELECT EventTitle FROM events WHERE ClientName = '"$_GET['cname']"'");
     while($row=mysqli_fetch_assoc($result)){
         echo "<option>".$row["EventTitle"]."</option>";
     }
 ?>

<script>
$(function(){
 $('#cname').on('change',function(){
    $.ajax({
     url:ajax.php,
     data:{cname:$('#cname').val()};
     type:'get',
     contentType:'html',
     success:function(data){
     $('#survey').append(data);
    }
    });
});
});
</script>