レスポンシブ・コンタクト/申請書

Question

私は、ユーザーが質問に回答し、応答性を探している申請書式を持っています。基本的に私が探していますは、ユーザーが次に

その他

<div> 
    <div> 
     <input type="checkbox" name="Other" value="Other" /> 
    </div> 
    <label>Other</label> 
</div> 

のようなものをチェックしている場合ように、いくつかの方法であり、唯一のそれは

<div> 
    <label>If other, which game(s)?</label> 
    <textarea name="Other Response"></textarea> 
</div> 

ありがとう示しています！私はそれが働いている。

Answer 1

最初にdisplay： 'none'プロパティを使用してテキストエリアのコンテンツを作成すると、他のチェックボックスをチェックすると、ユーザーには表示されず、他のContent HTMLエレメントの部分を表示できます。

ボックスはその後、チェックを外すと、あるときに隠されたコンテンツがある大ブレイクがないように、あなたは、コンテンツの残りの部分を調整する方法を知ってください、ここで

**HTML** 
<div class="userCheck"> 
<input type="checkbox" id="other" name="Other" value="Other" /> 
<label>Other</label> 
</div> 

<div class="otherCon"> 
<label>If other, which game(s)?</label> 
<textarea name="Other Response"></textarea> 
</div> 

**CSS** 
.otherCon { 
    visibility: hidden; 
} 

**JS** 
$('#other').on('click', function() { 
if ($(this).is(':checked')) { 
    $('.otherCon').css('visibility', 'visible'); 
} else { 
    $('.otherCon').css('visibility', 'hidden'); 
} 
});