Javascript：基于下拉列表选择显示/隐藏div

下面是我的下拉列表的HTML代码。选择

American

选项后，

下的American（）Javascript函数必须显示另一个div。但这不会发生

Javascript：

<script type="text/javascript">
    function American(){
        <!-- Getting the Canadian -> Hiding it -> Turning 'on' the American. -->
        var Canadian = document.getElementById('text-inputs-Canadian');
        Canadian.style.display = 'none';

        var American = document.getElementById('text-inputs-American');
        American.style.display = 'block';
    }
</script>

你知道我做错了什么吗

编辑：请求的代码，必须“显示”的div

                <div id="text-inputs-American">
                            <span id="text-labels">S<sub>s</sub>(g)</span>
                            <input type="number" step="any" />
                            <span id="text-labels">S<sub>1</sub>(g)</span>
                            <input type="number" step="any" />
                            <span id="text-labels">T<sub>0</sub>(g)</span>
                            <input type="number" step="any" />
                            <span id="text-labels">T<sub>L</sub>(g)</span>
                            <input type="number" step="any" />
                </div>

Ss（g）
S1（g）
T0（g）
TL（g）

哪些ID具有确切的div？我认为您混淆了如何使用getElementById方法：

试试这个：

 var Canadian = document.getElementById('text-inputs-Canadian');
 Canadian.style.display = 'none';

 var American = document.getElementById('text-inputs-American');
 American.style.display = 'block';

---

不要在getElementById方法上使用“#”字符来获取“文本输入对象”。

什么ID具有确切的div？我认为您混淆了如何使用getElementById方法：

试试这个：

 var Canadian = document.getElementById('text-inputs-Canadian');
 Canadian.style.display = 'none';

 var American = document.getElementById('text-inputs-American');
 American.style.display = 'block';

---

不要在getElementById方法上使用“#”字符来获取“文本输入对象”。

如果您熟悉JQuery，那么编写脚本就容易多了

只需编写一行代码即可完成：

$（'#IdofTheDiv'）。show（）//给我看div $（'#IdofTheDiv'）.hide（）//因为藏了潜水舱

---

此外，您甚至可以使用JQuery为div hide/show添加动画。

如果您熟悉JQuery，那么编写脚本的过程会轻松得多

只需编写一行代码即可完成：

$（'#IdofTheDiv'）。show（）//给我看div $（'#IdofTheDiv'）.hide（）//因为藏了潜水舱

---

此外，您甚至可以使用JQuery为div hide/show添加动画。

JS函数中的HTML风格注释让我感到可疑。您的浏览器控制台报告了哪些错误（如果有）？正确！尝试使用Javascript中的注释标准用法将注释放入JS函数中//Coment或/*多行注释*/我觉得JS函数中的HTML风格注释有点可疑。您的浏览器控制台报告了哪些错误（如果有）？正确！尝试使用Javascript中的注释标准用法将注释放入JS函数中//Coment或/*多行注释*/Hm，我试过了，没有解决。我将发布上面“显示”的div简短地显示您的代码，我想查看div及其ID。您的代码似乎很好，如果您更正了getElementById参数，我不知道为什么现在不工作。嗯，我尝试了，但没有修复它。我将发布上面“显示”的div简短地显示您的代码，我想看看div和它们的ID。您的代码似乎很好，如果您更正了getElementById参数，我不知道为什么现在不工作。哇，这很有效。。。我会用它，但我还是想知道我原来的问题的答案。哇，这很有效。。。我会用它，但我还是想回答我原来的问题。

 var Canadian = document.getElementById('text-inputs-Canadian');
 Canadian.style.display = 'none';

 var American = document.getElementById('text-inputs-American');
 American.style.display = 'block';