Javascript 如何在选择第一个列表中的项目后填充第二个列表最好是从数据库/excell中选择

这是一个非常具体的问题，我希望我能有所了解。我还没有关于这部分的任何代码，主要是因为我不确定从哪里开始

有一个主管下拉列表和一个代理下拉列表。我需要它的工作方式是，一旦您选择了主管，相应的代理将填充到代理下拉列表中。有成千上万的代理，所以需要一些时间才能真正通过并将它们全部打印出来。我们有一个数据库，可以自动填充和排序数据。是否有一种方法可以对其进行编码，以便从中选择的列表基本上生成第二个下拉列表

感谢您提前提供的任何帮助，并对缺少代码表示抱歉。我试着去研究，但结果却是两手空空

*编辑，这是我连接到服务器后得到的。它为我提供了主管的下拉列表，但我真的无法生成与该主管相关的代理列表。我将继续研究关于ajax和json的内容。但如果有人能帮助我更好地理解这一点，那就太棒了，我真的找不到任何MSSQL教程，只有文档。

$sql = "SELECT Supervisor FROM [tbl_Intake_SupervisorProfile]";
$stmt = sqlsrv_query( $conn, $sql );
if( $stmt === false) {
    die( print_r( sqlsrv_errors(), true) );
}

    echo"<Select Supervisoer='Supervisor'>";

while( $row = sqlsrv_fetch_array( $stmt, SQLSRV_FETCH_ASSOC) ) {
      echo "<option value='" . $row['Supervisor'] . "'>" . $row['Supervisor'] . "</option>";
}

    echo"</select>";

sqlsrv_free_stmt($stmt);


?>

jQuery：

$("#supervisor").on("change", populateAgents);

其中，populateAgents函数应类似于：

function populateAgents () {
   $.getJSON("getAgents.php", {supervisor: this.value}, function( agentsData ) {
       console.log( agentsData ); // test response
       // loop agents data and insert <option> elements into #agents 
   });
}

<?php

    // WARNING! This is a pseudo-demo!
    // Always sanitize (filter_var) your inputs and DB queries using PDO or such

    if ( isset($_GET["supervisor"])) {
       // SELECT * FROM agents WHERE supervisor = $_GET["supervisor"]
       // Than, after you build your $agentsArray
       echo json_encode($agentsArray);
       exit;
    }

在getAgents.php中，您可以看到如下内容：

function populateAgents () {
   $.getJSON("getAgents.php", {supervisor: this.value}, function( agentsData ) {
       console.log( agentsData ); // test response
       // loop agents data and insert <option> elements into #agents 
   });
}

<?php

    // WARNING! This is a pseudo-demo!
    // Always sanitize (filter_var) your inputs and DB queries using PDO or such

    if ( isset($_GET["supervisor"])) {
       // SELECT * FROM agents WHERE supervisor = $_GET["supervisor"]
       // Than, after you build your $agentsArray
       echo json_encode($agentsArray);
       exit;
    }

---

介意分享您已经拥有的吗？简单：1在supervisor select change事件上，AJAX您的后端API，如getAgents.php？q=superTrooper 2后端使用JSON列表进行响应3查询您的DB代理表，其中代理的主管与$GET[q]查询相匹配。4在成功回调中，清除代理从前面的选项元素中选择的内容，并通过循环返回的JSON创建选项元素。我已经有了非常基本的内容。它只是一个带有下拉列表和一些CSS样式的列表选项。我只是想知道该朝哪个方向走，罗科，你的回答肯定有道理。我对AJAX和JSON不太了解，但我会进一步研究，看看我能想到什么。总的来说，这似乎就是我想要的。如果我在写代码时还有其他问题，我会把它们贴在这里。谢谢你的参考。我目前正在查找AJAX和JSOM，以熟悉这段代码。一旦我对这两者有了更好的理解，我会回来参考这篇文章！底层代码具体在做什么？我知道它是检索信息，然后用echo生成的，但是如何在我的PHP文件中调用它呢。这应该通过jquery函数调用，但是当我把它放在一起时，它就不起作用了。。我至少了解正在发生的事情，但不知道如何将其联系起来。更具体地说是代理数组，它给了我一个未定义的变量，而我并不是100%地知道在哪里定义this@Malsum在PHP的回音上方，您可以找到两行注释。他们说的是——您需要通过查询SQL数据库以某种方式创建$agentsArray。使用JS和AJAX，您在$\u GET[supervisor]中向PHP传递了一个值。如果在数据库中有一个表代理，其行如下：id:0；姓名：someAgentName；supervisor:supervisorName-现在，如果使用SQL查询，如SELECT*FROM agents，其中supervisor=$\u GET[supervisor]，数据库将返回一个经过过滤的代理数组。由于jQuery的.getJSON需要JSON响应，因此可以使用PHP的JSON\u编码。因此，PHP将响应JSON，因此将返回给JS。由于console.log agentsData；，您应该可以在控制台中看到这样的JSON响应。从那时起，您可以在JS中使用agentsData数组对象执行任何操作。像创建UI表，创建选项下拉元素等等@Malsum真的很高兴你做到了！我能感受到你胜利的力量：