Question

我想创建简单的下拉选项，其中一个将是PASS然后显示DIV一旦从下拉菜单中选择选项PASS，其他选项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" />

Answer 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不匹配，您应该编写一个函数{{1}或者写changetextbox而不是两个......

getElementById('blah').onchange = function() {

Working example here

另一个注意事项你有

<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>

这应该是

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

我更改了元素

中

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

的大小写

Answer 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>

从下拉菜单中选择选项PASS后显示DIV

2 个答案: