根据 mysql 数据库中的下拉选择更改内容

Question

我有一种下拉框形式，其中填充了 mysql 数据库（计算机零件模型）中的值。我的目标是根据所选值从每个下拉框下方的数据库中生成其余值（零件规格）。

基本上我认为我需要的是在每次选择新项目时进行某种 div 刷新。

我尝试了由 select 标签中的“onchange”触发的不同功能，但没有任何效果。

让我知道上下文是否需要更多代码。

HTML 和 PHP 一个下拉菜单

<form id="parts">
        <fieldset>
            <legend>Choose your parts</legend>
            Any parts marked with * are required<br/><br/>
            <label for="CPU">CPU*</label><br/>
            <?php
                $cresult = $mysqli->query("SELECT * FROM pCpu ORDER BY cModel asc");
            ?>
                <select id="CPU" name="CPU">
                <option value="" disabled selected>Select your Part</option>
                <?php
                while ($rows = $cresult->fetch_assoc()) {
                    $cmodel = $rows['cModel'];
                    echo "<option value='$cmodel'>$cmodel</option>";
                    $cid = $rows['ID'];
                }
                ?>
                </select>
                <br/>

                <?php
                $res = $mysqli->query("SELECT cSocket FROM pCpu WHERE ID = '$cid'");
                while($rows = $res->fetch_assoc()) {
                    $csocket = $rows['cSocket'];
                    echo "CPU Socket: $csocket<br/>";
                }
                ?>

                <br/><br/>

解决这个问题的最佳方法是什么？

提前致谢！

Answer 1

这个答案有两个部分：

首先，如果您想使用 select 上的更改事件更新页面的一部分

function myUpdateFunc()
{
  
  
  var mySelected = $("#CPU").find("option:selected").val();
  $('#divResults').html ('selected value :' + mySelected)
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="parts">
        <fieldset>
            <legend>Choose your parts</legend>
            Any parts marked with * are required<br/><br/>
            <label for="CPU">CPU*</label><br/>
            
                <select id="CPU" name="CPU" onchange="myUpdateFunc()">
                <option value="" disabled selected>Select your Part</option>
                <option value="1">value 1</option>
                <option value="2">value 2</option>
                </select>
                <br/>

               <div id="divResults"/>

                <br/><br/>

下一步：

如果你想查询一个数据库，你可以查看很多关于这个的教程。我也可以帮你解决这个问题