ラジオボックスに基づくDIVセクションの表示/非表示

Question

いくつかのフォームを再加工しようとしていますが、一般的な「xxxxが必要ですか？はい/いいえのラジオボックス。彼らが「はい」を選択した場合は、以下のボックスに情報を入力する必要があります。私はそれが必要なそれぞれの質問ごとに別々の関数ではなく、それらのそれぞれのために働くことができる場合、私は1つのJQuery関数を使用したいと思います。

また、関係者が従業員であるかゲストであるかを問う質問もあります。ここでたくさんの良い記事がありましたので、選択するまでゲストDIVを隠していましたが、私はEmployee DIVで同じことをやっている方法はまだ分かりませんでした。私は3番目のセットベンダーの質問の

これは

<p> 
    Who was involved in this incident? &nbsp &nbsp 
    <input name="Victim" type="radio" value="Guest" required >Guest 
    &nbsp; &nbsp; 
    <input name="Victim" type="radio" value="Employee" > Employee 
    &nbsp; &nbsp; 

    <div id="Guest" class="desc"> 
    <p> 
    Some questions here ... 

とともにお客様のセクション

$(document).ready(function() { 
    $("div.desc").hide(); 
    $("input[name$='Victim']").click(function() { 
    var test = $(this).val(); 
     $("div.desc").hide(); 
     $("#" + test).show(); 
    }); 
}); 

を示した作業コードで誰もが、追加のコードの作業を取得するに沿って私を指すことができますか？ TIA

Answer 1

不明確あなたはEmployeeのidを持つdiv要素とVendorための1つを持っているし、ベンダーのラジオボタンを追加する場合....のコードが正常に動作します..あなたは....何を意味するか

$(document).ready(function() { 
 
    $("div.desc").hide(); 
 
    $("input[name$='Victim']").click(function() { 
 
    var test = $(this).val(); 
 
     $("div.desc").hide(); 
 
     $("#" + test).show(); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<h3> Who was involved in this incident? </h3> 
 

 
<p><label><input name="Victim" type="radio" value="Guest" required >Guest </label></p> 
 

 
<p><label><input name="Victim" type="radio" value="Employee" > Employee </label</p> 
 
    
 
    <p><label><input name="Victim" type="radio" value="Vendor" > Vendor</label></p> 
 
    
 

 
    <div id="Guest" class="desc"> 
 
    <p><strong>Guest</strong> questions here ...</p> 
 
    </div> 
 

 
    <div id="Employee" class="desc"> 
 
    <p><strong>Employee</strong> questions here ...</p> 
 
    </div> 
 

 
    <div id="Vendor" class="desc"> 
 
    <p><strong>Vendor</strong> questions here ...</p> 
 
    </div>