非表示HTMLフォーム要素にidの

Question

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<h2>Question 1</h2> 
 
<div> 
 
</div> 
 
<div> 
 
    <input type="radio" name="name_radio1" value="value_radio1" onclick=$().hide(); />Audio Question 
 
    <input type="radio" name="name_radio1" value="value_radio2" onclick=$().hide(); />Image Question 
 
    <input type="radio" name="name_radio1" value="value_radio3" onclick=$().hide(); />Standard Question 
 
</div> 
 
<div align="center" style="padding:25px;width: 300px;"> 
 
    <input name="question" size="35" class="standardQuestion" type="text" value="" /> 
 
    <br> 
 
    <input name="audioFile" class="audioFile" type="file" /> 
 
    <br> 
 
    <br> 
 
    <textarea name="message" rows="10" cols="20"> 
 
    </textarea> 
 
    <br> 
 
    <input name="imageFile" class="imageFile" type="file" /> 
 
    <br> 
 
</div> 
 
<div> 
 

 
    <h2>Question 2</h2> 
 
    <div> 
 
    </div> 
 
    <div> 
 
    <input type="radio" name="name_radio1" value="value_radio1" onclick=$().hide(); />Audio Question 
 
    <input type="radio" name="name_radio1" value="value_radio2" onclick=$().hide(); />Image Question 
 
    <input type="radio" name="name_radio1" value="value_radio3" onclick=$().hide(); />Standard Question 
 
    </div> 
 
    <div align="center" style="padding:25px;width: 300px;"> 
 
    <input name="question" size="35" class="standardQuestion" type="text" value="" /> 
 
    <br> 
 
    <input name="audioFile" class="audioFile" type="file" /> 
 
    <br> 
 
    <br> 
 
    <textarea name="message" rows="10" cols="20"> 
 
    </textarea> 
 
    <br> 
 
    <input name="imageFile" class="imageFile" type="file" /> 
 
    <br> 
 
    </div> 
 
    <div>

を使用していない `私は、私は、n個の質問に1から追加することができます他の誰かによって開始されたHTMLクイズエディタに追加しようとしています。クイズの質問は、音声録音、画像、または単なるテキストに基づいて行うことができます。質問がオーディオ/画像/テキストベースの質問の場合、オーディオ/画像/テキストベースの質問に関連するHTMLフォーム要素のみを表示する必要があります。クイズに関する質問は、編集者のユーザによって変更/更新/削除することができ、音声質問を画像またはテキストベースの質問に変更することができる。質問タイプがラジオボタンで変更された場合は、その質問タイプの適切なコントロールを表示する必要があります。例えば

...

質問1
ラジオImageQuestionラジオAudioQuestionラジオTextQuestion
ラジオボタンAudioQuestionがある場合はテキストボックス1（ラジオボタンImageQuestionがチェックされている場合にのみ表示さ）
ファイル（のみ表示さテキストボックス2（ラジオボタンTextQuestionがチェックされている場合にのみ表示さ）

は
）をチェック
質問2（上記と同じ要素） ....
質問N（上記と同じ要素）

各質問は、同じHTMLフォーム要素を有することになるが、それぞれの質問のデータはすべき独立しているので、ユーザーが特定のラジオボタンをクリックしてから質問1のコントロールを非表示にすると、2からNの質問に対しては何も表示されません。

私が扱う重要な制約はありません私が作業しているコードが途中で終了しているので、idを使用してください。 IDの。 IDのハードコードはできませんでした。なぜなら、実際に必要なものがどれくらいあるかわからないからです。 idを追加することは重要な変更ですが、これが唯一の合理的な方法である場合や、これを達成するための最良の方法である場合は、私にお知らせください。最高のアプローチを取るためのアドバイスをいただければ幸いです。今、コードはjquery/javascriptを使用しています。私はそれと基本的なhtml/cssに固執したいと思います。私は自分の研究に基づいて、.parent（）。find（ "特定のクラス"）とonclickイベントのようなコードを使用する必要があるかもしれないと推測していますが、これが正しいアプローチであり、 。ありがとう。

Answer 1

あなたはjavascriptなしでこれをしようとしていますか？