隐藏列表框在 JavaScript 之后不显示

hidden list box not showing after javascript

本文关键字:之后 显示 JavaScript 列表 隐藏      更新时间:2023-09-26

所以我对我在这里遇到的这个问题感到非常困惑。我几乎可以肯定这段代码是正确的,但是从第一个下拉框中选择某些内容后,我想要显示的列表框根本没有显示。这是我现在要编写的代码

<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<link href="css/template.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
    function view_private_user_list(){
    var i = document.status.private_users.options[document.status.private_users.selectedIndex].value;
    if(i == 1){
        document.getElementById('private_select_now').style.visibility="visible";
    } else{
        document.getElementById('private_select_now').style.visibility="visible";
    }
    }
    </script>
</head>
<body>
<div id="show_private_option">
<select id="private_users" onChange="view_private_user_list()">
<option value="0" SELECTED>Select user....</option>
<option value="1">Vincent</option>
</select>
<div id="private_select_now" style="visibility:hidden">
<select size="3">
<option value="">{#template_dlg.select}...</option>
<option value="SOOOOLDmax.htm">SOOOOLDmax</option>
<option value="mike.htm">tester</option>               
</select>
</div>
</div>
</body>
</html>

这个小提琴应该可以工作:

http://jsfiddle.net/3XENR/1/

我认为您尝试找出下拉列表当前值的方式不太有效。

请改用此版本的函数。

function view_private_user_list(){
    var selectEl = document.getElementById('private_users');
    var i = selectEl.value;
    if(i == 1){
        document.getElementById('private_select_now').style.visibility="visible";
    } else{
        document.getElementById('private_select_now').style.visibility="hidden";
    }
}

尝试:

document.getElementById('private_select_now').style.display ="block";和document.getElementById('private_select_now').style.display="none";

相反

而不是可见性,而是使用显示

 <script type="text/javascript">
    function view_private_user_list(){
var i = document.getElementById('private_users').selectedIndex.value
    if(i == 1){
        document.getElementById('private_select_now').style.display="block";
    } else{
        document.getElementById('private_select_now').style.display="none";
    }
    }
    </script>