基本javascript不是't工作-显示块

Basic javascript isn't working - display block

本文关键字:工作 显示 javascript 不是 基本      更新时间:2023-09-26

如果用户选择"House",我希望弹出一个新的选择选项框。目前什么都没有发生。

function showFamilies(){
if(pt.selectedIndex == 1)
document.getElementById('families').style.display = 'block';
if(pt.selectedIndex != 1)
document.getElementById('families').style.display = 'none';
}

<select id="pt" value="pt" name="pt" onChange="showFamilies()">
<option value="" name="">Select</option>
<option value="1" name="1">House</option>
<option value="2" name="2">Commercial</option>
</select>
<div id="families" style="display:none">Families: 
<select name="amin_families">
<option value="1" name="Condo">1</option>
<option value="2" name="Co-Op">2</option></select>
</div>

showFamilies函数中的pt可能未定义(取决于浏览器对http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#named-对窗口对象的访问)。尝试

function showFamilies(pt) {
    document.getElementById('families').style.display = pt.selectedIndex === 1
        ? 'block' : 'none';
}

以及在您的HTML 中

<select id="pt" name="pt" onchange="showFamilies(this)">

附言:<select>元素没有value属性。

重新定义了if语句。它现在运行良好。

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript">
    function showFamilies(pt){
    if(pt.selectedIndex == 1)
    {
    document.getElementById('families').style.display = 'block';
    }
    else
    {
    document.getElementById('families').style.display = 'none';
    }
    }
    </script>
    <title></title>
</head>
<body>

<select id="pt" value="pt" name="pt" onChange="showFamilies(this)">
    <option value="" name="">Select</option>
    <option value="1" name="1">House</option>
    <option value="2" name="2">Commercial</option>
</select>
<div id="families" style="display:none">Families:
    <select name="amin_families">
        <option value="1" name="Condo">1</option>
        <option value="2" name="Co-Op">2</option></select>
</div>
</body>
</html>

U必须通过this

<select id="pt" value="pt" name="pt" onChange="showFamilies(this)">

您的脚本:

function showFamilies(pt){
if(pt.selectedIndex == 1)
document.getElementById('families').style.display = 'block';
if(pt.selectedIndex != 1)
document.getElementById('families').style.display = 'none';
}