显示：无;div 不会显示 onchange()

Question

我有一些设置为display:none;的div，应该显示select菜单的onchange()。这是有问题的 html：

    <p>
        <label for="newsletter">Package</label>
        <select id="package" name="package" onchange="formupdate();">
            <option value="individual">Individual</option>
            <option value="couple">Couple</option>
            <option value="family">Family</option>
        </select>
    </p>
<div id="famnumdiv" style="display:none;">
    <p>
        <label for="famnum">How Many Members?</label>
        <input type="text" id="famnum" name="famnum"/>
    </p>
</div>

然后是onChange()函数：

function formupdate() {
    var selectedPackage = document.getElementById("package").value;
    if ( selectedPackage == 'family' ) {
        document.getElementByID('famnumdiv').style.display = "block";
    }
}

当我从select中选择Family时，没有任何反应。有什么想法吗？

编辑：更改为if ( selectedPackage == 'family' ) {，它仍然没有显示该div

Answer 1

您正在分配给selectedPackage两次。

第三行应为：

if ( selectedPackage == 'family' ) {

Answer 2

您的第二个getElementByID不正确，请尝试此getElementById

JavaScript 区分大小写

Answer 3

使用它，它使平等性更好

if ( selectedPackage === 'family' ) 

Answer 4

尝试将代码更改为

function formupdate() {
    var selectedPackage = document.getElementById("package").value;
    if ( selectedPackage == 'family' ) {
         document.getElementByID('famnumdiv').style.display = "block";
    }
}

如果在 if 语句中使用 selectedPackage = 'family'，

则 selectedPackage 的值将设置为带有两个"="的 'family'，if 语句将执行匹配

Answer 5

您正在将family分配给selectedPackage而不是比较。

此外，您没有正确选择所选选项。

var selectedPackage = document.getElementById("package");
selectedPackage = selectedPackage.options[selectedPackage.selectedIndex].value;

而且你也不应该使用内联js，添加一个eventListener。

var package = document.getElementById("package");
package.addEventListener("change",formupdate,false);