javascript - 使用 Javascript 隐藏和显示下拉菜单和文本字段

Question

在下面的下拉菜单中，当用户选择操作否时，我要显示下一个下拉菜单

<select id="OperationType" onChange="check(this);">
 <option value="OpNo">Operation No</option>
 <option value="OpEmp">Employee No</option>
</select>

<select id=OperationNos>
 <option value="1001">1001</option>
 <option value="1002">1002</option>
</select>

如果用户选择员工编号，我希望隐藏最后一个下拉菜单并显示以下文本字段:

<input type='text'>

我所做的是放置以下脚本，但它没有隐藏这两个元素:

function check(elem) {
    document.getElementById('OperationType').disabled = !elem.selectedIndex;
}

它只是禁用了它。我想让它不可见。谢谢

Answer 1

添加一个 style="display: none"到你的 OperationNos select:

您不需要将 this 传递给 check()。

如果选择了“OpNo”，请修改您的函数以切换此 css 属性:

function check() {
    var dropdown = document.getElementById("OperationType");
    var current_value = dropdown.options[dropdown.selectedIndex].value;

    if (current_value == "OpNo") {
        document.getElementById("OperationNos").style.display = "block";
    }
    else {
        document.getElementById("OperationNos").style.display = "none";
    }
}

示例:http://jsfiddle.net/2pna2/