Question

我有一些设置为display:none;的div，并且应该显示onchange()菜单的select。这是有问题的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";
    }
}

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

编辑：更改为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);

显示：无; div不会显示onchange（）

5 个答案: