jQueryまたはAjaxを使用してフィールドを表示または非表示にする

Question

jQueryを初めて使用しています。チェックボックスをクリック（選択）した後に日付フィールドを表示し、選択解除後に非表示にする方法を知りたいと思います。以下はスクリーンショットです。 - ありがとうございました。

Answer 1

HTML

<label for="chkEle">Check This</label> 
<input type="checkbox" name="chkEle" /> 
<div id="divEle" style="display:none;"><date stuff></div> 

JS

$("input[name=chkEle]").change(function(e) { 
    $("#divEle").toggle(); 
}); 

。チェックボックスの代わりにラベルをクリックしても、.changeがトリガーされます。これにより、後でjsを動的に変更することもできます。たとえば、ページのロード時にチェックボックスの選択を強制したい場合は、コードの末尾に$("input[name=chkEle]").change();を追加して、バックエンドと視覚的に変更を引き起こします

Answer 2

ただ、何でもあなたの適切なものでセレクタを置き換えます：

$('checkbox_selector').click(function() 
{ 
    $('date_field_selector').toggle(); 
}); 

Answer 3

$('#checkBox').click(function() { 
    $('#dateBox')[this.checked ? "show" : "hide"](); 
});