使用jQuery、Ajax和PHP动态选择框

我的代码基于 但我有一个单一的数据库coin_数据库，其中包含以下列：

id|coin_name|coin_country|value
1 |MapleLeaf|Canada      |5dollars
2 |Panda    |China       |10yuan

我想建立三个阶段的形式，首先你选择国家，而不是类型的硬币只从这个国家和之后，可用价值1盎司，5美元等

我有两个文件： index.php

ajaxData.php

---

它不适用于动态值Canada和MapleLeaf，但当我尝试将变量放入其中时，会出错。

但我会出错。。什么错误？根据if语句//状态选项列表中的代码错误，然后直接在数据库上运行查询并查看结果。还可以检查mysqli中的错误。如果我是对的，您会说：您的代码在选择国家->请求->权限回答时起作用，但在这之后，第二次选择在更改状态时不会触发事件？然后您可以尝试重新初始化jQuery事件监听器$'state'。在'change'上。。。。获取数据后，从coin_数据库中选择DISTINCT coin_name、coin_country、value、id，其中coin_country=‘Canada’ORDER BY coin_name DESC在数据库中运行此查询并检查其输出。

         <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<script type="text/javascript">
$(document).ready(function(){
    $('#country').on('change',function(){
        var countryID = $(this).val();
        if(countryID){
            $.ajax({
                type:'POST',
                url:'ajaxData.php',
                data:'country='+countryID,
                success:function(html){
                    $('#state').html(html);
                    $('#city').html('<option value="">Select state first</option>'); 
                }
            }); 
        }else{
            $('#state').html('<option value="">Select country first</option>');
            $('#city').html('<option value="">Select state first</option>'); 
        }
    });

    $('#state').on('change',function(){
        var stateID = $(this).val();
        if(stateID){
            $.ajax({
                type:'POST',
                url:'ajaxData.php',
                data:'name='+stateID,
                success:function(html){
                    $('#city').html(html);
                }
            }); 
        }else{
            $('#city').html('<option value="">Select state first</option>'); 
        }
    });
});
</script>


<?php
//Include the database configuration file
include 'db_conn.php';

//Fetch all the country data
$query = $conn->query("SELECT DISTINCT coin_country FROM coin_database ORDER BY coin_country ASC");

//Count total number of rows
$rowCount = $query->num_rows;
?>
<select id="country">
    <option value="">Country</option>
    <?php
    if($rowCount > 0){
        while($row = $query->fetch_assoc()){ 
            echo '<option value="'.$row['coin_country'].'">'.$row['coin_country'].'</option>';
        }
    }else{
        echo '<option value="">Country not available</option>';
    }
    ?>
</select>

<select id="state">
    <option value="">Coin</option>
</select>

<select id="city">
    <option value="">Value</option>
</select>

<?php
//Include the database configuration file
include 'db_conn.php';

if(!empty($_POST["country"])){
    //Fetch all state data
    $query = $conn->query("SELECT DISTINCT coin_name, coin_country, value, id FROM `coin_database` WHERE `coin_country` = 'Canada' ORDER BY `coin_name` DESC ");
    //Count total number of rows
    $rowCount = $query->num_rows;

    //State option list
    if($rowCount > 0){
        echo '<option value="">Coin</option>';
        while($row = $query->fetch_assoc()){ 
            echo '<option value="'.$row['id'].'">'.$row['coin_name'].'</option>';
        }
    }else{
        echo '<option value="">Error</option>';
    }
}   

    elseif(!empty($_POST["name"])){
    //Fetch all city data
    $query = $conn->query("SELECT DISTINCT `value` FROM `coin_database` WHERE `coin_name` = 'MapleLeaf' ORDER BY `id` DESC ");

    //Count total number of rows
    $rowCount = $query->num_rows;

    //City option list
    if($rowCount > 0){
        echo '<option value="">Value</option>';
        while($row = $query->fetch_assoc()){ 
            echo '<option value="'.$row['id'].'">'.$row['value'].'</option>';
        }
    }else{
        echo '<option value="">Value not available</option>';
    }
}
?>