問題

チェックボックスのcheckedプロパティをチェックし、jQueryを使用してチェックされたプロパティに基づいてアクションを実行する必要があります。

たとえば、年齢チェックボックスがオンになっている場合は、年齢を入力するテキストボックスを表示する必要があります。

しかし、次のコードはデフォルトでfalseを返します。

 if ($('#isAgeSelected').attr('checked'))
{
    $("#txtAge").show();
}
else
{
    $("#txtAge").hide();
} 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="checkbox" id="isAgeSelected"/>

<div id="txtAge" style="display:none">
Age is selected
</div> 

checkedプロパティを正常に照会するにはどうすればよいですか?

  ベストアンサー

チェックされたプロパティを正常に照会するにはどうすればよいですか?

チェックボックス DOM 要素の checked プロパティは、要素の checked 状態を返します。

既存のコードを考えると、これを行うことができます:

 if(document.getElementById('isAgeSelected').checked) {
    $("#txtAge").show();
} else {
    $("#txtAge").hide();
}
 

しかし、 toggle を使用して、これを行うもっときれいな方法があります。

 $('#isAgeSelected').click(function() {
    $("#txtAge").toggle(this.checked);
}); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="isAgeSelected"/>
<div id="txtAge" style="display:none">Age is something</div> 

  同じタグがついた質問を見る

javascriptjqueryhtmlcheckbox