gpt4 book ai didi

javascript - 使用 Javascript 的 HTML 中的下拉问题

转载 作者:行者123 更新时间:2023-12-03 12:16:45 26 4
gpt4 key购买 nike

我有下面的代码,在选择一个下拉值时,会很快显示相应的下拉列表。但我收到以下代码的一些错误。

在这里,我想在第一个下拉列表中选择大陆值时仅显示大陆名称。选择后,它应该显示第二个下拉列表,其中包含大陆名称的值,并且在第一个下拉列表中选择国家/地区值时,它应该在第二个下拉列表中显示国家/地区的值,并在第二个下拉列表中选择值时应该显示第三个,然后选择第三个下拉列表,然后它应该显示一个包含一些值的表格。

但就我而言,在选择第一个下拉值选项时,我无法看到第二个和第三个下拉列表的正确值。

例如: 如果我在第一个下拉列表中选择值大陆,它应该打开第二个下拉列表,其中仅包含大陆值,而不是国家/地区值。一旦我在第一个下拉列表中选择非洲,那么非洲选项中仅应显示非洲城市(约翰内斯堡和开普敦),而不是澳大利亚选项。

注意:以下是我收到的有问题的代码。您可以通过复制 test.txt 并另存为 test.html 格式并在 Firefox 或 IE 中打开来预览我的问题。

 <!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function onSelectContinent(a)
{
a = document.getElementById(a.value);
if(a != "Select")
{
document.getElementById("module").hidden=false;
}
else
{
document.getElementById("module").hidden=true;
}

}

function onSelectCountry(a)
{
a = document.getElementById(a.value);
if(a != "Select")
{
document.getElementById("count").hidden=false;
}
else
{
document.getElementById("count").hidden=true;
}

}

function onSelectApp(a)
{
a = document.getElementById(a.value);
if(a != "Select")
{
document.getElementById("apptable").hidden=false;
}
else
{
document.getElementById("count").hidden=true;
}

}
</script>

<html>
<body>
<h2>Check Repository Status</h2>
<p> </p>
&nbsp; <h3>&nbsp; Select Main Menu</h3>&nbsp;&nbsp;<br/>
<select name="docbase" id ="docbase" onchange="onSelectContinent(this);">
<option value="Select">Continent</option>
<option value="World">World</option>
<option value="Countries">Countries</option>
<option value="States">States</option>
<option value="Cities">Cities</option>
<option value="District">District</option>
</select>

<select name="modules" id ="module" hidden = "true" onchange="onSelectCountry(this);">
<option value="index">Asia</option>
<option value="bocs">Australia</option>
<option value="bocs">Africa</option>
<option value="bocs">America</option>
<option value="bocs">Europe</option>
</select>
<select name="modules" id ="module1" hidden = "true" onchange="onSelectModule1(this);">
<option value="Select">Australia</option>
<option value="App">India</option>
<option value="docbase">USA</option>
<option value="index">England</option>
<option value="bocs">Newzealand</option>
<option value="index">SouthAfrica</option>

</select>
<select name="Applications" id ="count" hidden = "true" onchange="onSelectApp(this);">
<option value="Select">Select</option>
<option value="App">Capetown</option>
<option value="docbase">Johnesberg</option>
</select>
<br/><br/>
<table border="1" width="200" id="apptable" hidden="true">
<tr>
<td><b>Population</b></td>
<td><b>Area</b></td>
</tr>
<tr>
<td>20millions</td><td>10000sq-miles</td>
</tr>
</table>
</body>
</html>

最佳答案

这一行:

a = document.getElementById(a.value);

应该是:

a = a.value;

DEMO

关于javascript - 使用 Javascript 的 HTML 中的下拉问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24650926/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com