7

ユーザーが選択ドロップダウンリストから特定のオプション値を選択した場合、div を表示しようとしています。

例：

選択ドロップダウン リストは、データベースから取得された動的な名前と、「管理者」と呼ばれるリストの下部にある 1 つの静的または永続的な名前で構成されます。

ユーザーが「管理者」以外のオプションを選択すると、特定のフォーム要素を含む div が表示され、ユーザーが「管理者」を選択すると、その 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>

これについて助けていただければ幸いです。

4

7 に答える 7

1

これを試して：

JS:

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

HTML:

<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>
于 2013-05-23T11:45:17.707 に答える
1

body loadイベントに変更イベント ハンドラーをアタッチ<div>し、選択に基づいて非表示/非表示にすることができます。

HTML

<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>

次のコードを Head タグに挿入します。

<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>

本文で onload 関数を呼び出します。

<body onload="onload()">

jsfiddle デモ

于 2013-05-23T11:48:42.900 に答える
1

試す

<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';
}

デモ:フィドル

于 2013-05-23T11:50:08.740 に答える
0 
<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>

デモ: https://jsfiddle.net/kingtaherkings/swzmxkej/

于 2018-10-31T11:45:01.530 に答える
0

this.selectに変更this:

 <select id="getFname" onchange="admSelectCheck(this);">

その後、正常に動作するはずです。また、持っている場合は、次のようjQueryに簡単に実行できます。

$("#getFname").change(function() {
   var val = $(this).text();
   if (val != "Admin") {
      $("#div").show();
   }
});

純粋な JS 関数も提供します。

于 2013-05-23T11:40:41.247 に答える