Javascript 根据下拉列表选择更改文本字段的数量

在从下拉列表中选择“id”之后，我试图显示两个测试字段。它被设置为隐藏，当选择“id”时，我试图使它可见。不幸的是，它不起作用。请帮忙

<form>
            <input class="hidden" type="text" id="textField2">
            <input type="text" id="textField">

             <select id="select" name="selectData">
                    <option value="firstName">Name</option>
                    <option value="id">Id</option>
            </select>
            <input id="filter" type="button" value="Filter">

            <script>
                    var temp = document.getElementById("textField2").value;
                    if(document.getElementById("select")[0].value === "id"){
                            temp.style.visibility = "visible";
                    }else {
                            temp.style.visibility = "hidden";
                    }
            </script>
</form>

名称
身份证件
var temp=document.getElementById（“textField2”）.value；
if（document.getElementById（“选择”）[0]。value==“id”）{
temp.style.visibility=“可见”；
}否则{
temp.style.visibility=“隐藏”；
}

---

某个地方可能有错误，或者可能有其他（更好的）方法来执行此操作？

您可以使用以下解决方案：

函数切换（）{
var temp=document.getElementById（“textField2”）；
//检查所选选项。
if（document.getElementById（“select”）.value==“id”）{
temp.style.visibility=“可见”；
}否则{
temp.style.visibility=“隐藏”；
}
}
名称
身份证件

document.getElementById（“select”）[0]。值应为：
document.getElementById（“select”）.value
作为
document.getElementById（）
仅返回一个元素（或
null
，如果该元素未找到或（尚未）存在）；不需要索引。