通过 Javascript 函数启用的选择框

Question

我正在尝试在另一个选择框中选择一个选项时启用一个选择框。在这种情况下，当用户在第一个选择框中选择 R 或 C 时，应该启用第二个框。我试图在这里复制解决方案：Selectbox disabled or enabled by an option of an other selectbox，但是我使用的表单设置为提交和休息按钮，以及许多其他输入和选择字段。我对 Javascript 和 HTML 也很陌生，所以如果我做了一些愚蠢的事情，我不会完全感到惊讶。

我的Javascript函数如下，放在HTML正文代码之后：

<script type="text/javascript">
    document.getElementById("part").onchange = function () 
    {       
        if (document.getElementById("part").value == "R" || document.getElementById("part").value == "C") 
        {
            document.getElementByID('part_number').disabled = false;
        }
        else 
        {
            document.getElementByID('part_number').disabled = true;
        }
    }
</script>

选择框是：

<select class="form-control" name="part[]" id="part" style="display: inline-block; width: 50%;" data-index="1">
    <option value disabled selected> -- Select a part -- </option>
    <option value='R'>R</option>
    <option value='C'>C</option>
</select>
<select multiple class="form-control" name="part_number[]" id="part_number" style="display: inline-block; width: 50%;" disabled>
    <option value disabled selected> -- Select a part -- </option>
    <?php for ($i = 1; $i < 100; $i++){?>
    <option value="<?php echo $i; ?>"><?php echo $i; ?></option>
    <?php } ?>
</select>

第二个框包含选项 1-99，默认情况下禁用。这两个文本框可以通过动态 Javascript 函数多次复制，这就是我使用数组的原因。我的浏览器控制台也没有错误。我正在使用最新版本的谷歌浏览器。任何帮助将不胜感激。谢谢。

Answer 1

您的代码的唯一问题是您在if else 指令中使用getElementByID（大写D）而不是getElementById

应该是：

if (selectedPart === "R" || selectedPart  === "C") 
{
    document.getElementById('part_number').disabled = false;
} else {   
    document.getElementById('part_number').disabled = true;
}

Answer 2

您没有正确获取下拉列表的选定值：

<script type="text/javascript">
    document.getElementById("part").onchange = function () 
    {       
        var partList = document.getElementById("part");
        var selectedPart = partList.options[partList.selectedIndex].value;

        if (selectedPart === "R" || selectedPart  === "C") 
        {
            document.getElementById('part_number').disabled = false;
        }
        else 
        {
            document.getElementById('part_number').disabled = true;
        }
    }
</script>