Javascript 如果选择了特定的选择选项值，则显示div_Javascript

Javascript 如果选择了特定的选择选项值，则显示div

javascript

Javascript 如果选择了特定的选择选项值，则显示div,javascript,Javascript,如果用户从选择下拉列表中选择特定的选项值，我尝试显示一个div 例如：选择下拉列表包括从数据库获取的动态名称，以及列表底部名为Admin的静态或永久名称如果用户选择的选项不是Admin，则会显示包含特定表单元素的div；如果用户选择Admin，则该div将保持隐藏状态这是我的密码： Javascript- <script language="javascript"> function admSelectCheck(nameSelect) { if(nameSelect

如果用户从选择下拉列表中选择特定的选项值，我尝试显示一个div

例如：

选择下拉列表包括从数据库获取的动态名称，以及列表底部名为Admin的静态或永久名称

如果用户选择的选项不是Admin，则会显示包含特定表单元素的div；如果用户选择Admin，则该div将保持隐藏状态

这是我的密码：

Javascript-

<script language="javascript">

function admSelectCheck(nameSelect)
{
    if(nameSelect){
        admOptionValue = document.getElementById("admOption").value;
        if(admOptionValue != 0){
            document.getElementById("admDivCheck").style.display = "";
        }
        else{
            document.getElementById("admDivCheck").style.display = "none";
        }
    }
    else{
        document.getElementById("admDivCheck").style.display = "none";
    }
}

</script>

HTML-

<select id="getFname" onchange="admSelectCheck(this.select);">
<option value="1">Jay</option>
<option value="4">Sam</option>
<option id="admOption" value="0">Admin</option>
</select>


<div id="admDivCheck" style="display:none;">
admin selected
</div>

很高兴能得到帮助。

更改此项。选择此项：

也将提供一个纯JS函数

我想你需要这样

只需更改这一行：

还有HTML

onchange=admSelectCheckthis

使用this.select是不正确的

以下是正确的代码：

HTML

请参阅上的演示。

尝试以下操作：

JS:

HTML:

您可以在主体加载事件上附加更改事件处理程序，并根据选择隐藏/取消隐藏：

HTML

将以下代码放入Head tag中：

<script type="text/javascript">

function onload() {
   document.getElementById("getFname").onchange = function (e) {
   if (this.value == 0) {
     document.getElementById("admDivCheck").style.display="";
   } else {
     document.getElementById("admDivCheck").style.display="none";
  }
 };

}

</script>

调用body中的onload函数：

<body onload="onload()">

试一试

演示：

@Cobra\u Fast-我说过我也会发布一个纯JS解决方案。谢谢回复。虽然我更愿意在不使用jquery的情况下通过javascript完成这项工作，但我还是会尝试一下，看看结果如何。谢谢大家，我要说的是谢谢大家，谢谢大家对我的问题发表了回答和评论！我非常感谢你们@Darren Davies我真的很感激你的回答是第一个尝试帮助的人。谢谢对其他人，万分感谢！

admOptionValue = document.getElementById("getFname").value;
//alert(admOptionValue);

if(admOptionValue == 0){
     document.getElementById("admDivCheck").style.display = "";
}
else{
     document.getElementById("admDivCheck").style.display = "none";
 }

<select id="getFname" onchange="admSelectCheck(this);">
<option value="1">Jay</option>
<option value="4">Sam</option>
<option id="admOption" value="0">Admin</option>
</select>


<div id="admDivCheck" style="display:none;">
admin selected
</div>

function admSelectCheck(nameSelect)
{
    console.log(nameSelect);
    if(nameSelect){
        admOptionValue = document.getElementById("admOption").value;
        if(admOptionValue == nameSelect.value){
            document.getElementById("admDivCheck").style.display = "block";
        }
        else{
            document.getElementById("admDivCheck").style.display = "none";
        }
    }
    else{
        document.getElementById("admDivCheck").style.display = "none";
    }
}

function admSelectCheck(nameSelect)
{
    if(nameSelect){
        admOptionValue = nameSelect.value;
        if(admOptionValue != 0){
            nameSelect.style.display = "";
        }
        else{
            nameSelect.style.display = "none";
        }
    }
    else{
        nameSelect.style.display = "none";
    }
}

<select id="getFname" onchange="admSelectCheck(this);">
<option value="1">Jay</option>
<option value="4">Sam</option>
<option id="admOption" value="0">Admin</option>
</select>

<div id="admDivCheck" style="display:none;">
admin selected
</div>

<select id="getFname">
  <option value="1">Jay</option>
  <option value="4">Sam</option>
  <option id="admOption" value="0">Admin</option>
</select>


<div id="admDivCheck" style="display:none;">
   admin selected
</div>

<script type="text/javascript">

function onload() {
   document.getElementById("getFname").onchange = function (e) {
   if (this.value == 0) {
     document.getElementById("admDivCheck").style.display="";
   } else {
     document.getElementById("admDivCheck").style.display="none";
  }
 };

}

</script>

<body onload="onload()">

<select id="getFname" onchange="admSelectCheck(this);">
    <option value="1">Jay</option>
    <option value="4">Sam</option>
    <option id="admOption" value="0">Admin</option>
</select>


<div id="admDivCheck" style="display:none;">
    admin selected
</div>

function admSelectCheck(nameSelect)
{
    var val = nameSelect.options[nameSelect.selectedIndex].value;
    document.getElementById("admDivCheck").style.display = val == '0' ? "block" : 'none';
}

<select id="getFname">
<option value="1">Jay</option>
<option value="4">Sam</option>
<option value="0">Admin</option>
</select>


<div id="admDivCheck" style="display:none;">
admin selected
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

<script>
$("#getFname").on("change",function(){"0"===$(this).val()?$("#admDivCheck").show():$("#admDivCheck").hide()});
</script>