从下拉菜单中选择选项PASS后显示DIV [关闭]答案

【问题标题】：show DIV once selected option PASS from drop down menu [closed]从下拉菜单中选择选项PASS后显示DIV [关闭]
【发布时间】：2012-07-16 10:19:10
【问题描述】：

我想创建带有选项的简单下拉菜单，其中一个将是 PASS，然后在从下拉菜单中选择选项 PASS 后显示 DIV，其他选项 DIV 将被关闭

<script type="text/javascript">
document.getElementById('mfi_4_a_i').onchange = function(){
    if (this.value == 'PASS') {
        document.getElementById('sdd').style.display = "block";
    } else {
        document.getELementById('sdd').style.display = "none";
    }
};
</script>
<select id="test" name="test" onChange="changetextbox();">
    <option value="PASS">PASS</option>
    <option>No</option>
    <option>No, but planning in future</option>
</select>

<input type="text" name="test" id="sdd" />

【问题讨论】：

卡住的实际问题是什么？
好吧，它只是行不通:(
向我们展示更多代码，例如生成下拉列表的部分和带有 div 的部分
@user974435 从true 和false 中删除'

标签： javascript

【解决方案1】：

改变顺序

<select id="test" name="test" onChange="changetextbox();">
    <option value="PASS">PASS</option>
    <option>No</option>
    <option>No, but planning in future</option>
</select>

<input type="text" name="test" id="sdd" />

<script type="text/javascript">
document.getElementById('mfi_4_a_i').onchange = function(){
    if (this.value == 'PASS') {
        document.getElementById('sdd').style.display = "block";
    } else {
        document.getELementById('sdd').style.display = "none";
    }
};
</script>

您需要确保当 JavaScript 运行时 DOM 元素准备就绪 ....

注意您的 id 属性与 JavaScript 中的 ..mfi_4_a_i 与 HTML 中的 test 都不匹配，您应该编写函数 changetextbox 或编写 getElementById('blah').onchange = function() { 而不是两者...

<select id="test" name="test">
    <option value="PASS">PASS</option>
    <option>No</option>
    <option>No, but planning in future</option>
</select>

<input type="text" name="test" id="sdd" />

<script type="text/javascript">
document.getElementById('test').onchange = function(){
    if (this.value == 'PASS') {
        document.getElementById('sdd').style.display = "block";
    } else {
        document.getElementById('sdd').style.display = "none";
    }
};
</script>

Working example here

另一个笔记你有

document.getELementById('sdd').style.display = "none";

这应该是

document.getElementById('sdd').style.display = "none";

我在 Element 中更改了 L 的大小写

【讨论】：

已修复，但仍然无法正常工作
@user974435 在底部看到我的更新......对我来说工作正常（注意你在document.getElementById('sdd').display = "none" 行中也有一个错误......你的getElementById 有一个大写的L元素

【解决方案2】：

你会想要这样的：

<script type="text/javascript">
document.getElementById('ID_OF_DROPDOWN').onchange = function(){
    if (this.value == 'PASS') {
        document.getElementById('ID_OF_DIV').style.display = "block";
    } else {
        document.getELementById('ID_OF_DIV').style.display = "none";
    }
};
</script>

【讨论】：

它不起作用，已经解决了主要问题