如何在没有数据库的情况下根据第一个下拉选择自动更新下拉选项？

如何根据第一个下拉列表中的选择自动更新第二个下拉列表中的选项，而不使用数据库

您有两个下拉列表，其中选项不是从数据库中检索的。第一个下拉列表允许用户选择一个类别。第二个下拉列表中的选项取决于第一个下拉列表中的选择。

例如，如果用户在第一个下拉列表中选择 First 选项，第二个下拉列表应显示选项 智能手机和充电器。如果用户将选择更改为 第二个 选项，第二个下拉列表现在应显示选项 篮球 和 排球。

不使用数据库实现

<select name="category" onchange="changeSecondDropdown(this)"><pre class="brush:php;toolbar:false"><option value="0">None</option>
<option value="1">First</option>
<option value="2">Second</option>

<script><br>function changeSecondDropdown(category) {<br> const options = {</script>

"1": ["Smartphone", "Charger"],
"2": ["Basketball", "Volleyball"]

};

//清除第二个下拉列表中的选项
const itemsDropdown = document.getElementById("items");
itemsDropdown.innerHTML = "";

// 根据所选类别添加新选项
const selectedOptions = options[category.value];
for (const option of selectedOptions) {

const newOption = document.createElement("option");
newOption.value = option;
newOption.textContent = option;
itemsDropdown.appendChild(newOption);

}
}

此实现使用 JavaScript 对象来存储每个类别的选项。当用户更改第一个下拉列表中的选择时，将调用changeSecondDropdown函数，该函数根据所选类别更新第二个下拉列表中的选项。

以上是如何在没有数据库的情况下根据第一个下拉选择自动更新下拉选项？的详细内容。更多信息请关注PHP中文网其他相关文章！