基于jQuery、Ajax和PHP的联动下拉框失效问题求助（大学项目）

看起来你的联动下拉功能没跑起来，我帮你梳理下代码里的几个关键问题，以及对应的修复方案：

一、HTML厂商下拉框的查询问题 #

你当前的厂商下拉用了INNER JOIN tblmodel，这会导致同一个厂商因为关联多个型号而重复出现在选项里，应该直接查询厂商表来避免重复：

<select name="manufacturername" id="manufacturername" class="form-control">
    <option selected>Choose...</option>
    <?php 
    $ret = "SELECT * FROM tblmanufacturer"; // 直接查询厂商表，避免重复选项
    $query = $dbh->prepare($ret);
    $query->execute();
    $results = $query->fetchAll(PDO::FETCH_OBJ);
    if($query->rowCount() > 0) {
        foreach($results as $result) {
    ?>
    <option value="<?php echo htmlentities($result->ManufacturerCode);?>">
        <?php echo htmlentities($result->ManufacturerName);?>
    </option>
    <?php }} ?>
</select>
<select name="modelname" id="modelname" class="form-control">
    <option selected>Choose...</option>
</select>

二、AJAX处理脚本（AJAXdata.php）的问题 #

这里有两个核心问题：数据库连接对象不一致（你HTML里用的是PDO的$dbh，但AJAX脚本里用了$db），还有直接拼接SQL存在SQL注入风险，改成PDO预处理语句更安全：

<?php
// 确保使用和HTML页面一致的PDO连接对象$dbh
if(isset($_POST["ManufacturerCode"]) && !empty($_POST["ManufacturerCode"])){
    // 用预处理语句避免SQL注入
    $query = $dbh->prepare("SELECT ModelCode, ModelName FROM tblmodel WHERE ManufacturerCode = :code");
    $query->bindParam(':code', $_POST['ManufacturerCode'], PDO::PARAM_STR);
    $query->execute();
    $rowCount = $query->rowCount();
    
    if($rowCount > 0){
        echo '<option value="">Select Model</option>';
        while($row = $query->fetch(PDO::FETCH_ASSOC)){
            echo '<option value="'.$row['ModelCode'].'">'.$row['ModelName'].'</option>';
        }
    }else{
        echo '<option value="">Model not available</option>';
    }
}
?>

三、JavaScript代码的优化 #

把数据传递改成对象格式更清晰，同时建议加上错误处理方便排查问题，还要确保页面已经正确引入jQuery库（这是很多联动失效的常见原因）：

<script type="text/javascript">
$(document).ready(function(){
    $('#manufacturername').on('change',function(){
        var ManufacturerCode = $(this).val();
        if(ManufacturerCode){
            $.ajax({
                type:'POST',
                url:'AJAXdata.php',
                data: {ManufacturerCode: ManufacturerCode}, // 用对象格式传递参数
                success:function(html){
                    $('#modelname').html(html);
                },
                // 新增错误处理，方便排查请求失败的情况
                error:function(){
                    $('#modelname').html('<option value="">Failed to load models</option>');
                }
            });
        }else{
            $('#modelname').html('<option value="">Select manufacturer first</option>');
        }
    });
});
</script>

额外排查点 #

• 检查AJAXdata.php的路径是否正确，确保和当前页面在同一目录或者路径书写无误
• 打开浏览器控制台（F12），查看Network标签下的AJAX请求，确认是否有404错误，或者返回的内容是否符合预期
• 确认数据库中tblmodel和tblmanufacturer的ManufacturerCode字段关联正常，数据没有缺失

内容的提问来源于stack exchange，提问作者Muhammad Wazexr