Php 基于前面的选择从mysql中选择HTML

我目前正在建立一个网站。我想用3个HTML选择字段实现一个功能

• 城市

• 街道

• 建筑

我能够充分利用所有不同的城市、街道和建筑物。然而，这并不是我所需要的，因为它们都被洗牌了，你无法真正看到某个城市是否有某条街道

以下是我想到的算法：

先决条件：除城市之外的所有下拉菜单均被禁用，并且仅在选择上方的下拉菜单中启用

• 步骤1：用户通过下拉菜单选择城市
• 步骤2：然后将该城市的所有

  街道

  从MySQL中提取到

  街道

  下拉列表中，现在它已启用
• 步骤3：用户通过下拉菜单选择街道
• 第4步：所有

  建筑

  的

  街道

  都从MySQL中提取到

  建筑

  下拉列表中，现在它已启用

我是一个非常新的网站开发，所以请容忍我在这里，如果可能的话-指向我在正确的方向

我目前的执行情况：

<select name="city">
                <?php
                if ($result = mysqli_query($conn, $queryCity)) {
                    if (mysqli_num_rows($result) > 0) {
                        while ($row = mysqli_fetch_array($result)) {
                            echo "<option value='" . $row['city'] . "'>" . $row['city'] . "</option>";
                            $selected = $row['city'];
                        }
                    }
                }
                ?>
            </select>
            <select name="street">
                <?php
                if ($result = mysqli_query($conn, $queryStreet)) {
                    if (mysqli_num_rows($result) > 0) {
                        while ($row = mysqli_fetch_array($result)) {
                            echo "<option value='" . $row['city'] . "'>" . $row['city'] . "</option>";
                            $selected = $row['city'];
                        }
                    }
                }
                ?>
            </select>
            <select name="building">
                <?php
                if ($result = mysqli_query($conn, $queryBuilding)) {
                    if (mysqli_num_rows($result) > 0) {
                        while ($row = mysqli_fetch_array($result)) {
                            echo "<option value='" . $row['city'] . "'>" . $row['city'] . "</option>";
                            $selected = $row['city'];
                        }
                    }
                }
                ?>
            </select>

---

您的算法可以这样工作。
但是，如果用户选择了一个城市，您可能需要重新加载页面或使用异步请求（例如AJAX）获取内容。您可以将城市作为GET或POST参数传递，如果设置了该参数，则搜索街道并启用下拉菜单，否则只需禁用下拉菜单。这同样适用于建筑物。

---

当使用带有用户输入的查询时，请使用准备好的语句而不是普通查询，因为您不希望被访问；）

我已经找到了解决这个问题的方法，而且非常简单

.js：

function getBuildings（）{
let street=document.getElementById（“street”）.value；
让ajax=newXMLHttpRequest（）；
let method=“POST”；
让url=“get_buildings_of_street.php”；
让异步=真；
常量obj={}；
obj.street=街道；
open（方法、url、异步）；
setRequestHeader（“内容类型”、“应用程序/json”）；
ajax.onreadystatechange=函数（）{
if（this.readyState==4&&this.status==200）{
让data=JSON.parse（this.responseText）；
设html=“”；
html++=“+”-“+”；
for（设a=0；a

function getBuildings() {
    let street = document.getElementById("street").value;

    let ajax = new XMLHttpRequest();
    let method = "POST";
    let url = "get_buildings_of_street.php";
    let asynchronous = true;
    const obj = {};
    obj.street = street;

    ajax.open(method, url, asynchronous);
    ajax.setRequestHeader("Content-type", "application/json");
    ajax.onreadystatechange = function () {
        if (this.readyState === 4 && this.status === 200) {
            let data = JSON.parse(this.responseText);
            let html = "<select>";
            html += "<option value='" + "-" + "'>" + "-" + "</option>";
            for (let a = 0; a < data.length; a++) {
                html += "<option value='" + data[a] + "'>";
                html += data[a];
                html += "</option>";
            }
            html += "</select>";
            document.getElementById("building").innerHTML = html;
        }
    }
    ajax.send(JSON.stringify(obj));
}