Javascript 正在尝试创建多个隐藏的HTML下拉列表，但失败_Javascript_Jquery_Html_Html Select

Javascript 正在尝试创建多个隐藏的HTML下拉列表，但失败

javascript jquery html

Javascript 正在尝试创建多个隐藏的HTML下拉列表，但失败,javascript,jquery,html,html-select,Javascript,Jquery,Html,Html Select,我正在尝试创建一个提交表单，允许我的用户创建一个资产注册列表，我正在尝试获取位置字段。但是，用户必须首先选择一个建筑，然后选择一个楼层，然后最后选择一个房间我可以将所有位置都包含在一个元素，但是列表将是巨大而丑陋的。还有房间名在不同的网站上是相似的，所以最好将它们保存在一个单独的元素我希望用户首先从下拉菜单中选择一个建筑。然后，我想另一个下拉菜单出现在下面，这取决于关于他们的建筑选择。一旦他们选择了他们的楼层，我会然后像第三个选择下拉菜单出现，然后会问他们根据上一次选择中

我正在尝试创建一个提交表单，允许我的用户创建一个资产注册列表，我正在尝试获取位置字段。但是，用户必须首先选择一个建筑，然后选择一个楼层，然后最后选择一个房间

我可以将所有位置都包含在一个元素，但是列表将是巨大而丑陋的。还有房间名在不同的网站上是相似的，所以最好将它们保存在一个单独的元素

我希望用户首先从下拉菜单中选择一个建筑。然后，我想另一个下拉菜单出现在下面，这取决于关于他们的建筑选择。一旦他们选择了他们的楼层，我会然后像第三个选择下拉菜单出现，然后会问他们根据上一次选择中的选项，再次选择房间元素

我可以使用if…else函数显示一个隐藏的选择列表简单地在block/none之间切换，但我似乎不能使用相同的方法返回以前的值隐藏选择列表

我已经包含了一些基本代码。我对这方面不是很有经验所以我刚刚创建了一个简单的if…else语句计划在我得到这个概念证明后使用switch语句放下

建筑物总是可见的

楼层已隐藏，只能通过建筑列表显示/隐藏

房间已隐藏，只能按楼层或建筑列表显示/隐藏

如果这还不清楚，我很乐意进一步解释。已经很晚了我想要一双新的眼睛来看看我的代码

提前感谢,

你的函数调用是错误的。将其修复为onchange=sublocCheckthis；它会解决你的问题

第二个问题是locCheck的else语句，显示none应转到id=floor而非id=195

顺便说一句，重新考虑一下你的方法。如果取消选择195，地板下拉列表将隐藏。那么你就不能隐藏房间号码下拉列表了

功能选择{ 如果choice.value==195{ document.getElementByIdfloor.style.display=block； } 否则{ document.getElementByIdfloor.style.display=none； } } 函数子occheckchoice{ 如果choice.value==底层{ document.getElementByIdroom.style.display=block； } 否则{ document.getElementByIdroom.style.display=none； } } 场地* -选择一个站点- 195 123 8. 场外地板* -选择一个楼层- 一楼一楼地下室房间* -选择一个房间- 1号房间房间2 3号房间

<script>
    function locCheck(choice) {
        if (choice.value == "195"){
    document.getElementById("floor").style.display = "block";
        }
        else {
    document.getElementById("195").style.display = "none";
            }
    }
    </script>

    <script>
    function sublocCheck(choice) {
        if (choice.value == "Ground Floor"){
    document.getElementById("room").style.display = "block";
        }
        else {
            document.getElementById("room").style.display = "none";
            }
    }
    </script>


</head>
<body>
    <div id="building">
        <span>site*</span>
        <div>
            <select onchange='locCheck(this);'>
            <option value="">-- Select A Site --</option>
            <option value="195">195  </option>
            <option value="123">123  </option>
            <option value="8">8  </option>
            <option value="Off-Site">Off-Site</option>
            </select>
        </div>
    </div>

    <div id="floor" style="display: none;">
                  <span>Floor*</span>
           <div>
            <select onchange="sublocCheck(sl);"> 
            <option value="">-- Select A  Floor --</option>
            <option value="Ground Floor"> Ground Floor</option>
            <option value="First Floor"> First Floor</option>
            <option value="Basement Floor"> Basement Floor</option>
            </select>
                  </div>
    </div>

    <div id="room" style="display: none;" >
                  <span>room*</span>
           <div>
            <select> 
            <option>-- Select A room --</option>
            <option>room1</option>
            <option>room2</option>
            <option>room3</option>
            </select>
                  </div>
            </div>
</body>