blocks|key|4028388|text|这对我很有效：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4028389|$get("isAgeSelected+").checked+==+true|code-block|syntax|javascript|4028390|其中isAgeSelected是控件的id。|offset|length|style|CODE|4028391|而且，@karim79的answer运行得很好。我不确定我在测试的时候错过了什么。|4028392|注意，这是使用Microsoft+Ajax的答案，而不是jQuery|BOLD|4028393|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/901712/check-checkbox-checked-property-using-jquery/901727#901727^0|0|0|2|D|0|C|6|0|0|0|Y|0^^$0|@$1|2|3|4|5|6|7|Z|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|10|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|11|8|@$I|12|J|13|K|L]]|9|@]|A|$]]|$1|M|3|N|5|6|7|14|8|@]|9|@$I|15|J|16|1|17]]|A|$]]|$1|O|3|P|5|6|7|18|8|@$I|19|J|1A|K|Q]]|9|@]|A|$]]|$1|R|3|-4|5|6|7|1B|8|@]|9|@]|A|$]]]|S|$T|$5|U|V|W|A|$X|Y]]]]

<p>This worked for me:</p>

<pre><code>$get("isAgeSelected ").checked == true
</code></pre>

<p>Where <code>isAgeSelected</code> is the id of the control.</p>

<p>Also, @karim79's <a href="https://stackoverflow.com/questions/901712/check-checkbox-checked-property-using-jquery/901727#901727">answer</a> works fine. I am not sure what I missed at the time I tested it.</p>

<p><strong>Note, this is answer uses Microsoft Ajax, not jQuery</strong></p>


blocks|key|809511|text|type|unstyled|depth|inlineStyleRanges|entityRanges|data|809512|如何成功查询勾选属性？|blockquote|809513|809514|809515|checkbox+DOM元素的checked属性将为您提供元素的checked状态。|offset|length|style|CODE|809516|在给定现有代码的情况下，您可以这样做：|809517|if(document.getElementById('isAgeSelected').checked)+{
++++$("#txtAge").show();
}+else+{
++++$("#txtAge").hide();
}|code-block|syntax|javascript|809518|但是，有一种更好的方法可以做到这一点，即使用toggle|809519|​|809520|$('#isAgeSelected').click(function()+{
++++$("#txtAge").toggle(this.checked);
});|809521|<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>|809522|809523|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/toggle/^0|0|0|0|0|F|7|W|7|0|0|0|M|6|M|6|0|0|0|0|0|0^^$0|@$1|2|3|-4|4|5|6|19|7|@]|8|@]|9|$]]|$1|A|3|B|4|C|6|1A|7|@]|8|@]|9|$]]|$1|D|3|-4|4|5|6|1B|7|@]|8|@]|9|$]]|$1|E|3|-4|4|5|6|1C|7|@]|8|@]|9|$]]|$1|F|3|G|4|5|6|1D|7|@$H|1E|I|1F|J|K]|$H|1G|I|1H|J|K]]|8|@]|9|$]]|$1|L|3|M|4|5|6|1I|7|@]|8|@]|9|$]]|$1|N|3|O|4|P|6|1J|7|@]|8|@]|9|$Q|R]]|$1|S|3|T|4|5|6|1K|7|@$H|1L|I|1M|J|K]]|8|@$H|1N|I|1O|1|1P]]|9|$]]|$1|U|3|V|4|5|6|1Q|7|@]|8|@]|9|$]]|$1|W|3|X|4|P|6|1R|7|@]|8|@]|9|$Q|R]]|$1|Y|3|Z|4|P|6|1S|7|@]|8|@]|9|$Q|R]]|$1|10|3|V|4|5|6|1T|7|@]|8|@]|9|$]]|$1|11|3|-4|4|5|6|1U|7|@]|8|@]|9|$]]]|12|$13|$4|14|15|16|9|$17|18]]]]

<blockquote>
  <p>How do I successfully query the checked property?</p>
</blockquote>

<p>The <code>checked</code> property of a checkbox DOM element will give you the <code>checked</code> state of the element.</p>

<p>Given your existing code, you could therefore do this:</p>

<pre><code>if(document.getElementById('isAgeSelected').checked) {
    $("#txtAge").show();
} else {
    $("#txtAge").hide();
}
</code></pre>

<p>However, there's a much prettier way to do this, using <a href="http://api.jquery.com/toggle/" rel="noreferrer"><code>toggle</code></a>:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$('#isAgeSelected').click(function() {
    $("#txtAge").toggle(this.checked);
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;input type="checkbox" id="isAgeSelected"/&gt;
&lt;div id="txtAge" style="display:none"&gt;Age is something&lt;/div&gt;</code></pre>
</div>
</div>
</p>


blocks|key|809841|text|使用jQuery的is()函数：|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|809842|if($("#isAgeSelected").is(':checked'))
++++$("#txtAge").show();++//+checked
else
++++$("#txtAge").hide();++//+unchecked|code-block|syntax|javascript|809843|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/is/^0|9|4|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@$A|R|B|S|1|T]]|C|$]]|$1|D|3|E|5|F|7|U|8|@]|9|@]|C|$G|H]]|$1|I|3|-4|5|6|7|V|8|@]|9|@]|C|$]]]|J|$K|$5|L|M|N|C|$O|P]]]]

<p>Use jQuery's <a href="http://api.jquery.com/is/" rel="noreferrer">is()</a> function:</p>

<pre><code>if($("#isAgeSelected").is(':checked'))
    $("#txtAge").show();  // checked
else
    $("#txtAge").hide();  // unchecked
</code></pre>


blocks|key|809853|text|使用jQuery+>+1.6|type|unstyled|depth|inlineStyleRanges|entityRanges|data|809854|<input+type="checkbox"+value="1"+name="checkMeOut"+id="checkMeOut"+checked="checked"+/>

//+traditional+attr
$('#checkMeOut').attr('checked');+//+"checked"
//+new+property+method
$('#checkMeOut').prop('checked');+//+true|code-block|syntax|javascript|809855|使用新的属性方法：|809856|if($('#checkMeOut').prop('checked'))+{
++++//+something+when+checked
}+else+{
++++//+something+else+when+not
}|809857|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>Using jQuery > 1.6 </p>

<pre><code>&lt;input type="checkbox" value="1" name="checkMeOut" id="checkMeOut" checked="checked" /&gt;

// traditional attr
$('#checkMeOut').attr('checked'); // "checked"
// new property method
$('#checkMeOut').prop('checked'); // true
</code></pre>

<p>Using the new property method:</p>

<pre><code>if($('#checkMeOut').prop('checked')) {
    // something when checked
} else {
    // something else when not
}
</code></pre>


blocks|key|810780|text|jQuery+1.6%2B|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|810781|$('#isAgeSelected').prop('checked')|code-block|syntax|javascript|810782|jQuery+1.5及以下版本的|810783|$('#isAgeSelected').attr('checked')|810784|任何版本的jQuery|810785|//+Assuming+an+event+handler+on+a+checkbox
if+(this.checked)|810786|所有的功劳都归功于Xian。|810787|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/a/426276/443427^0|0|B|0|0|0|G|0|0|0|B|0|0|9|4|0|0^^$0|@$1|2|3|4|5|6|7|12|8|@$9|13|A|14|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|15|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|16|8|@$9|17|A|18|B|C]]|D|@]|E|$]]|$1|M|3|N|5|H|7|19|8|@]|D|@]|E|$I|J]]|$1|O|3|P|5|6|7|1A|8|@$9|1B|A|1C|B|C]]|D|@]|E|$]]|$1|Q|3|R|5|H|7|1D|8|@]|D|@]|E|$I|J]]|$1|S|3|T|5|6|7|1E|8|@]|D|@$9|1F|A|1G|1|1H]]|E|$]]|$1|U|3|-4|5|6|7|1I|8|@]|D|@]|E|$]]]|V|$W|$5|X|Y|Z|E|$10|11]]]]

<p><strong>jQuery 1.6+</strong></p>

<pre><code>$('#isAgeSelected').prop('checked')
</code></pre>

<p><strong>jQuery 1.5 and below</strong></p>

<pre><code>$('#isAgeSelected').attr('checked')
</code></pre>

<p><strong>Any version of jQuery</strong></p>

<pre><code>// Assuming an event handler on a checkbox
if (this.checked)
</code></pre>

<p>All credit goes to <a href="https://stackoverflow.com/a/426276/443427">Xian</a>.</p>


blocks|key|809626|text|我正在使用这个，并且它工作得非常好：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|809627|$("#checkkBoxId").attr("checked")+?+alert("Checked")+:+alert("Unchecked");|code-block|syntax|javascript|809628|注意:如果复选框被选中，它将返回true否则未定义，因此最好检查"TRUE“值。|809629|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>I am using this and this is working absolutely fine:</p>

<pre><code>$("#checkkBoxId").attr("checked") ? alert("Checked") : alert("Unchecked");
</code></pre>

<p>Note: If the checkbox is checked it will return true otherwise undefined, so better check for the "TRUE" value.</p>


blocks|key|811214|text|使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|811215|<input+type="checkbox"+name="planned_checked"+checked+id="planned_checked">+Planned

$("#planned_checked").change(function()+{
++++if($(this).prop('checked'))+{
++++++++alert("Checked+Box+Selected");
++++}+else+{
++++++++alert("Checked+Box+deselect");
++++}
});|code-block|syntax|javascript|811216|​|811217|++++$("#planned_checked").change(function()+{
++++++++if($(this).prop('checked'))+{
++++++++++++alert("Checked+Box+Selected");
++++++++}+else+{
++++++++++++alert("Checked+Box+deselect");
++++++++}
++++});|811218|<script+src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input+type="checkbox"+name="planned_checked"+checked+id="planned_checked">+Planned|811219|811220|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|Q|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|R|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|S|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|M|3|H|5|6|7|U|8|@]|9|@]|A|$]]|$1|N|3|-4|5|6|7|V|8|@]|9|@]|A|$]]]|O|$]]

<p>Use:</p>

<pre><code>&lt;input type="checkbox" name="planned_checked" checked id="planned_checked"&gt; Planned

$("#planned_checked").change(function() {
    if($(this).prop('checked')) {
        alert("Checked Box Selected");
    } else {
        alert("Checked Box deselect");
    }
});
</code></pre>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>    $("#planned_checked").change(function() {
        if($(this).prop('checked')) {
            alert("Checked Box Selected");
        } else {
            alert("Checked Box deselect");
        }
    });</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;input type="checkbox" name="planned_checked" checked id="planned_checked"&gt; Planned</code></pre>
</div>
</div>
</p>


blocks|key|4028887|text|从jQuery+1.6开始，jQuery.attr()的行为发生了变化，建议用户不要使用它来检索元素的选中状态。相反，您应该使用jQuery.prop()|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4028888|$("#txtAge").toggle(
++++$("#isAgeSelected").prop("checked")+//+For+checked+attribute+it+returns+true/false;
++++++++++++++++++++++++++++++++++++++++//+Return+value+changes+with+checkbox+state
);|code-block|syntax|javascript|4028889|另外两种可能性是：|4028890|$("#txtAge").get(0).checked
$("#txtAge").is(":checked")|4028891|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/attr/|1|http://api.jquery.com/prop/^0|E|D|1S|D|E|D|0|1S|D|1|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Y|8|@$9|Z|A|10|B|C]|$9|11|A|12|B|C]]|D|@$9|13|A|14|1|15]|$9|16|A|17|1|18]]|E|$]]|$1|F|3|G|5|H|7|19|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|1A|8|@]|D|@]|E|$]]|$1|M|3|N|5|H|7|1B|8|@]|D|@]|E|$I|J]]|$1|O|3|-4|5|6|7|1C|8|@]|D|@]|E|$]]]|P|$Q|$5|R|S|T|E|$U|V]]|W|$5|R|S|T|E|$U|X]]]]

<p>Since jQuery 1.6, the behavior of <a href="http://api.jquery.com/attr/"><code>jQuery.attr()</code></a> has changed and users are encouraged  not to use it to retrieve an element's checked state. Instead, you should use <a href="http://api.jquery.com/prop/"><code>jQuery.prop()</code></a>:</p>

<pre><code>$("#txtAge").toggle(
    $("#isAgeSelected").prop("checked") // For checked attribute it returns true/false;
                                        // Return value changes with checkbox state
);
</code></pre>

<p>Two other possibilities are:</p>

<pre><code>$("#txtAge").get(0).checked
$("#txtAge").is(":checked")
</code></pre>


blocks|key|4874451|text|如果您使用的是更新版本的jquery，则必须使用.prop方法来解决您的问题：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4874452|如果选中，$('#isAgeSelected').prop('checked')将返回true；如果未选中，则返回false。我证实了这一点，我之前遇到了这个问题。$('#isAgeSelected').attr('checked')和$('#isAgeSelected').is('checked')正在返回undefined，这对于这种情况来说不是一个有价值的答案。因此，请按照下面的说明进行操作。|4874453|if($('#isAgeSelected').prop('checked'))+{
++++$("#txtAge").show();
}+else+{
++++$("#txtAge").hide();
}|code-block|syntax|javascript|4874454|希望它能帮上忙:)-谢谢。|4874455|entityMap^0|O|5|0|5|Z|17|4|1L|5|2A|Z|3A|X|4B|9|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|T|8|@$9|U|A|V|B|C]|$9|W|A|X|B|C]|$9|Y|A|Z|B|C]|$9|10|A|11|B|C]|$9|12|A|13|B|C]|$9|14|A|15|B|C]]|D|@]|E|$]]|$1|H|3|I|5|J|7|16|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|17|8|@]|D|@]|E|$]]|$1|O|3|-4|5|6|7|18|8|@]|D|@]|E|$]]]|P|$]]

<p>If you are using an updated version of jquery, you must go for <code>.prop</code> method to resolve your issue:</p>

<p><code>$('#isAgeSelected').prop('checked')</code> will return <code>true</code> if checked and <code>false</code> if unchecked. I confirmed it and I came across this issue earlier. <code>$('#isAgeSelected').attr('checked')</code> and <code>$('#isAgeSelected').is('checked')</code> is returning <code>undefined</code> which is not a worthy answer for the situation. So do as given below.</p>

<pre><code>if($('#isAgeSelected').prop('checked')) {
    $("#txtAge").show();
} else {
    $("#txtAge").hide();
}
</code></pre>

<p>Hope it helps :)- Thanks.</p>


blocks|key|810477|text|使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|810478|<input+type="checkbox"+id="abc"+value="UDB">UDB
<input+type="checkbox"+id="abc"+value="Prasad">Prasad|code-block|syntax|javascript|810479|$('input#abc').click(function(){
++if($(this).is(':checked'))
++{
++++var+checkedOne=$(this).val()
++++alert(checkedOne);

++++//+Do+some+other+action
++}
})|810480|如果您希望所需操作仅在选中复选框时执行，而不是在取消选中时执行，则这会有所帮助。|810481|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|D|7|O|8|@]|9|@]|A|$E|F]]|$1|I|3|J|5|6|7|P|8|@]|9|@]|A|$]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>Use:</p>

<pre><code>&lt;input type="checkbox" id="abc" value="UDB"&gt;UDB
&lt;input type="checkbox" id="abc" value="Prasad"&gt;Prasad
</code></pre>



<pre><code>$('input#abc').click(function(){
  if($(this).is(':checked'))
  {
    var checkedOne=$(this).val()
    alert(checkedOne);

    // Do some other action
  }
})
</code></pre>

<p>This can help if you want that the required action has to be done only when you check the box not at the time you remove the check.</p>


blocks|key|4873899|text|使用checkbox属性的Click事件处理程序是不可靠的，因为checked属性在事件处理程序本身的执行过程中可能会更改！|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4873900|理想情况下，您可能希望将代码放入change事件处理程序中，因为每次更改复选框的值时都会触发该事件处理程序(独立于它是如何完成的)。|4873901|$('#isAgeSelected').bind('change',+function+()+{

+++if+($(this).is(':checked'))
+++++$("#txtAge").show();
+++else
+++++$("#txtAge").hide();
});|code-block|syntax|javascript|4873902|entityMap^0|D|5|W|7|0|G|6|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]|$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|T|8|@$9|U|A|V|B|C]]|D|@]|E|$]]|$1|H|3|I|5|J|7|W|8|@]|D|@]|E|$K|L]]|$1|M|3|-4|5|6|7|X|8|@]|D|@]|E|$]]]|N|$]]

<p>Using the <code>Click</code> event handler for the checkbox property is unreliable, as the <code>checked</code> property can change during the execution of the event handler itself!</p>

<p>Ideally, you'd want to put your code into a <code>change</code> event handler such as it is fired every time the value of the check box is changed (independent of <em>how</em> it's done so).</p>

<pre><code>$('#isAgeSelected').bind('change', function () {

   if ($(this).is(':checked'))
     $("#txtAge").show();
   else
     $("#txtAge").hide();
});
</code></pre>


blocks|key|4028855|text|我决定发布一个关于如何在没有jQuery的情况下做同样的事情的答案。就因为我是个叛逆者。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4028856|var+ageCheckbox+=+document.getElementById('isAgeSelected');
var+ageInput+=+document.getElementById('txtAge');

//+Just+because+of+IE+<333
ageCheckbox.onchange+=+function()+{
++++//+Check+if+the+checkbox+is+checked,+and+show/hide+the+text+field.
++++ageInput.hidden+=+this.checked+?+false+:+true;
};|code-block|syntax|javascript|4028857|首先通过ID获取这两个元素，然后为checkbox的onchange事件分配一个函数，该函数检查是否选中了checkbox，并相应地设置了年龄文本字段的hidden属性。在该示例中使用三元运算符。|offset|length|style|CODE|4028858|这是一个供您测试的fiddle。|4028859|附录|BOLD|4028860|如果跨浏览器兼容性是一个问题，那么我建议将CSS+display属性设置为none和inline。|4028861|elem.style.display+=+this.checked+?+'inline'+:+'none';|4028862|速度较慢，但跨浏览器兼容。|4028863|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/mainerror/cjSkC/^0|0|0|Q|8|24|6|0|9|6|0|0|0|2|0|P|7|0|0|0^^$0|@$1|2|3|4|5|6|7|15|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|16|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|17|8|@$I|18|J|19|K|L]|$I|1A|J|1B|K|L]]|9|@]|A|$]]|$1|M|3|N|5|6|7|1C|8|@]|9|@$I|1D|J|1E|1|1F]]|A|$]]|$1|O|3|P|5|6|7|1G|8|@$I|1H|J|1I|K|Q]]|9|@]|A|$]]|$1|R|3|S|5|6|7|1J|8|@$I|1K|J|1L|K|L]]|9|@]|A|$]]|$1|T|3|U|5|D|7|1M|8|@]|9|@]|A|$E|F]]|$1|V|3|W|5|6|7|1N|8|@]|9|@]|A|$]]|$1|X|3|-4|5|6|7|1O|8|@]|9|@]|A|$]]]|Y|$Z|$5|10|11|12|A|$13|14]]]]

<p>I decided to post an answer on how to do that exact same thing without jQuery. Just because I'm a rebel.</p>

<pre><code>var ageCheckbox = document.getElementById('isAgeSelected');
var ageInput = document.getElementById('txtAge');

// Just because of IE &lt;333
ageCheckbox.onchange = function() {
    // Check if the checkbox is checked, and show/hide the text field.
    ageInput.hidden = this.checked ? false : true;
};
</code></pre>

<p>First you get both elements by their ID. Then you assign the checkboxe's <code>onchange</code> event a function that checks whether the checkbox got checked and sets the <code>hidden</code> property of the age text field appropriately. In that example using the ternary operator.</p>

<p>Here is a <a href="http://jsfiddle.net/mainerror/cjSkC/" rel="noreferrer">fiddle</a> for you to test it.</p>

<p><strong>Addendum</strong></p>

<p>If cross-browser compatibility is an issue then I propose to set the CSS <code>display</code> property to <em>none</em> and <em>inline</em>.</p>

<pre><code>elem.style.display = this.checked ? 'inline' : 'none';
</code></pre>

<p>Slower but cross-browser compatible.</p>


blocks|key|811637|text|您可以尝试使用checkbox的change事件来跟踪:checked状态更改。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|811638|​|811639|$("#isAgeSelected").on('change',+function()+{
++if+($("#isAgeSelected").is(':checked'))
++++alert("checked");
++else+{
++++alert("unchecked");
++}
});|code-block|syntax|javascript|811640|<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>|811641|811642|entityMap^0|G|6|R|8|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@$9|S|A|T|B|C]|$9|U|A|V|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|W|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|X|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|J|7|Y|8|@]|D|@]|E|$K|L]]|$1|O|3|G|5|6|7|Z|8|@]|D|@]|E|$]]|$1|P|3|-4|5|6|7|10|8|@]|D|@]|E|$]]]|Q|$]]

<p>You can try the <code>change</code> event of checkbox to track the <code>:checked</code> state change.</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$("#isAgeSelected").on('change', function() {
  if ($("#isAgeSelected").is(':checked'))
    alert("checked");
  else {
    alert("unchecked");
  }
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;input type="checkbox" id="isAgeSelected" /&gt;
&lt;div id="txtAge" style="display:none"&gt;
  Age is selected
&lt;/div&gt;</code></pre>
</div>
</div>
</p>


blocks|key|4873556|text|我相信你可以这样做：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4873557|if+($('#isAgeSelected+:checked').size()+>+0)
{
++++$("#txtAge").show();+
}+else+{+
++++$("#txtAge").hide();
}|code-block|syntax|javascript|4873558|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>I believe you could do this:</p>

<pre><code>if ($('#isAgeSelected :checked').size() &gt; 0)
{
    $("#txtAge").show(); 
} else { 
    $("#txtAge").hide();
}
</code></pre>


blocks|key|4028520|text|我遇到了完全相同的问题。我有一个ASP.NET复选框|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4028521|<asp:CheckBox+ID="chkBox1"+CssClass='cssChkBox1'+runat="server"+/>|code-block|syntax|javascript|4028522|在jQuery代码中，我使用了下面的选择器来检查复选框是否被选中，它看起来像是一个不错的选择。|4028523|if+($("'.cssChkBox1+input[type=checkbox]'").is(':checked'))
{+...+}+else+{+...+}|4028524|我相信你也可以用ID代替CssClass，|4028525|if+($("'#cssChkBox1+input[type=checkbox]'").is(':checked'))
{+...+}+else+{+...+}|4028526|我希望这对你有帮助。|4028527|entityMap^0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|W|8|@]|9|@]|A|$]]|$1|M|3|N|5|D|7|X|8|@]|9|@]|A|$E|F]]|$1|O|3|P|5|6|7|Y|8|@]|9|@]|A|$]]|$1|Q|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|R|$]]

<p>I ran in to the exact same issue. I have an ASP.NET checkbox</p>

<pre><code>&lt;asp:CheckBox ID="chkBox1" CssClass='cssChkBox1' runat="server" /&gt;
</code></pre>

<p>In the jQuery code I used the following selector to check if the checkbox was checked or not, and it seems to work like a charm.</p>

<pre><code>if ($("'.cssChkBox1 input[type=checkbox]'").is(':checked'))
{ ... } else { ... }
</code></pre>

<p>I'm sure you can also use the ID instead of the CssClass,</p>

<pre><code>if ($("'#cssChkBox1 input[type=checkbox]'").is(':checked'))
{ ... } else { ... }
</code></pre>

<p>I hope this helps you.</p>


blocks|key|4030015|text|此代码将帮助您|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|4030016|$('#isAgeSelected').click(function(){
+++console.log(this.checked);
+++if(this.checked+==+true)+{
++++++++$("#txtAge").show();
++++}+else+{
+++++++$("#txtAge").hide();
+++}
});|code-block|syntax|javascript|4030017|entityMap^0|0|7|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

<p><strong>This code will help you</strong></p>

<pre><code>$('#isAgeSelected').click(function(){
   console.log(this.checked);
   if(this.checked == true) {
        $("#txtAge").show();
    } else {
       $("#txtAge").hide();
   }
});
</code></pre>


blocks|key|1267491|text|这对我来说很有效：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1267492|/*+isAgeSelected+being+id+for+checkbox+*/

$("#isAgeSelected").click(function(){
++$(this).is(':checked')+?+$("#txtAge").show()+:+$("#txtAge").hide();
});|code-block|syntax|javascript|1267493|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>This works for me:</p>

<pre><code>/* isAgeSelected being id for checkbox */

$("#isAgeSelected").click(function(){
  $(this).is(':checked') ? $("#txtAge").show() : $("#txtAge").hide();
});
</code></pre>


blocks|key|4874863|text|有许多方法可以检查复选框是否选中：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4874864|使用jQuery进行检查的方法|4874865|if+(elem.checked)
if+($(elem).prop("checked"))
if+($(elem).is(":checked"))
if+($(elem).attr('checked'))|code-block|syntax|javascript|4874866|检查示例或文档：|4874867|4874868|http://api.jquery.com/attr/|unordered-list-item|offset|length|4874869|http://api.jquery.com/prop/|4874870|4874871|entityMap|0|LINK|mutability|MUTABLE|url|1^0|0|0|0|0|0|0|R|0|0|0|R|1|0|0^^$0|@$1|2|3|4|5|6|7|11|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|12|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|13|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|14|8|@]|9|@]|A|$]]|$1|K|3|-4|5|6|7|15|8|@]|9|@]|A|$]]|$1|L|3|M|5|N|7|16|8|@]|9|@$O|17|P|18|1|19]]|A|$]]|$1|Q|3|R|5|N|7|1A|8|@]|9|@$O|1B|P|1C|1|1D]]|A|$]]|$1|S|3|-4|5|6|7|1E|8|@]|9|@]|A|$]]|$1|T|3|-4|5|6|7|1F|8|@]|9|@]|A|$]]]|U|$V|$5|W|X|Y|A|$Z|M]]|10|$5|W|X|Y|A|$Z|R]]]]

<p>There are many ways to check if a checkbox is checked or not:</p>

<p>Way to check using jQuery</p>

<pre><code>if (elem.checked)
if ($(elem).prop("checked"))
if ($(elem).is(":checked"))
if ($(elem).attr('checked'))
</code></pre>

<p>Check example or also document:</p>

<ul>
<li><p><a href="http://api.jquery.com/attr/" rel="noreferrer">http://api.jquery.com/attr/</a></p></li>
<li><p><a href="http://api.jquery.com/prop/" rel="noreferrer">http://api.jquery.com/prop/</a></p></li>
</ul>


blocks|key|811120|text|这是一些不同的方法来做同样的事情：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|811121|​|811122|$(document).ready(function+(){

++++$('#isAgeSelected').click(function()+{
++++++++//+$("#txtAge").toggle(this.checked);

++++++++//+Using+a+pure+CSS+selector
++++++++if+($(this.checked))+{
++++++++++++alert('on+check+1');
++++++++};

++++++++//+Using+jQuery's+is()+method
++++++++if+($(this).is(':checked'))+{
++++++++++++alert('on+checked+2');
++++++++};

++++++++//++//+Using+jQuery's+filter()+method
++++++++if+($(this).filter(':checked'))+{
++++++++++++alert('on+checked+3');
++++++++};
++++});
});|code-block|syntax|javascript|811123|<script+src="http://code.jquery.com/jquery-1.9.1.js"></script>
<input+type="checkbox"+id="isAgeSelected"/>
<div+id="txtAge"+style="display:none">Age+is+something</div>|811124|811125|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|P|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|K|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|M|$]]

<p>This is some different method to do the same thing:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function (){

    $('#isAgeSelected').click(function() {
        // $("#txtAge").toggle(this.checked);

        // Using a pure CSS selector
        if ($(this.checked)) {
            alert('on check 1');
        };

        // Using jQuery's is() method
        if ($(this).is(':checked')) {
            alert('on checked 2');
        };

        //  // Using jQuery's filter() method
        if ($(this).filter(':checked')) {
            alert('on checked 3');
        };
    });
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="http://code.jquery.com/jquery-1.9.1.js"&gt;&lt;/script&gt;
&lt;input type="checkbox" id="isAgeSelected"/&gt;
&lt;div id="txtAge" style="display:none"&gt;Age is something&lt;/div&gt;</code></pre>
</div>
</div>
</p>


blocks|key|811209|text|使用以下命令：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|811210|if+($('input[name="salary_in.Basic"]:checked').length+>+0)|code-block|syntax|javascript|811211|如果选中该复选框，则长度大于零。|811212|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>Use this:</p>

<pre><code>if ($('input[name="salary_in.Basic"]:checked').length &gt; 0)
</code></pre>

<p>The length is greater than zero if the checkbox is checked.</p>


blocks|key|4028729|text|我这样做的方式是：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4028730|if+(+$("#checkbox:checked").length+)+{+++++++
++++alert("checkbox+is+checked");
}+else+{
++++alert("checkbox+is+not+checked");
}|code-block|syntax|javascript|4028731|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>My way of doing this is:</p>

<pre><code>if ( $("#checkbox:checked").length ) {       
    alert("checkbox is checked");
} else {
    alert("checkbox is not checked");
}
</code></pre>


blocks|key|809992|text|$(selector).attr('checked')+!==+undefined|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|809993|如果输入已选中，则返回true；如果未选中，则返回false。|unstyled|offset|length|style|CODE|809994|entityMap^0|0|B|4|P|5|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|N|8|@$G|O|H|P|I|J]|$G|Q|H|R|I|J]]|9|@]|A|$]]|$1|K|3|-4|5|F|7|S|8|@]|9|@]|A|$]]]|L|$]]

<pre><code>$(selector).attr('checked') !== undefined
</code></pre>

<p>This returns <code>true</code> if the input is checked and <code>false</code> if it is not.</p>


blocks|key|810896|text|$(document).ready(function()+{++++
++++$('#agecheckbox').click(function()+{
++++++++if($(this).is(":checked"))
++++++++{
++++++++++++$('#agetextbox').show();
++++++++}+else+{
++++++++++++$('#agetextbox').hide();
++++++++}
++++});
});|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|810897|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>$(document).ready(function() {    
    $('#agecheckbox').click(function() {
        if($(this).is(":checked"))
        {
            $('#agetextbox').show();
        } else {
            $('#agetextbox').hide();
        }
    });
});
</code></pre>


blocks|key|4029901|text|您可以使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4029902|++if(document.getElementById('isAgeSelected').checked)
++++$("#txtAge").show();++
++else
++++$("#txtAge").hide();|code-block|syntax|javascript|4029903|4029904|if($("#isAgeSelected").is(':checked'))
++$("#txtAge").show();++
else
++$("#txtAge").hide();|4029905|这两种方法都应该可以工作。|4029906|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|O|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|P|8|@]|9|@]|A|$]]|$1|H|3|I|5|D|7|Q|8|@]|9|@]|A|$E|F]]|$1|J|3|K|5|6|7|R|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|M|$]]

<p>You can use:</p>

<pre><code>  if(document.getElementById('isAgeSelected').checked)
    $("#txtAge").show();  
  else
    $("#txtAge").hide();
</code></pre>

<hr>

<pre><code>if($("#isAgeSelected").is(':checked'))
  $("#txtAge").show();  
else
  $("#txtAge").hide();
</code></pre>

<p>Both of them should work.</p>


blocks|key|1267986|text|HTML1)如果你的标记是：|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|1267987|<input+type="checkbox"++/>|code-block|syntax|javascript|1267988|使用的属性：|1267989|$(element).attr("checked");+//+Will+give+you+undefined+as+initial+value+of+checkbox+is+not+set|1267990|如果使用prop：|1267991|$(element).prop("checked");+//+Will+give+you+false+whether+or+not+initial+value+is+set|1267992|HTML2)如果你的标记是：|1267993|+<input+type="checkbox"++checked="checked"+/>//+May+be+like+this+also++checked="true"|1267994|1267995|$(element).attr("checked")+//+Will+return+checked+whether+it+is+checked="true"|1267996|使用的道具：|1267997|$(element).prop("checked")+//+Will+return+true+whether+checked="checked"|1267998|entityMap^0|A|4|0|0|0|0|0|0|A|4|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|15|8|@$9|16|A|17|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|18|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|19|8|@]|D|@]|E|$]]|$1|M|3|N|5|H|7|1A|8|@]|D|@]|E|$I|J]]|$1|O|3|P|5|6|7|1B|8|@]|D|@]|E|$]]|$1|Q|3|R|5|H|7|1C|8|@]|D|@]|E|$I|J]]|$1|S|3|T|5|6|7|1D|8|@$9|1E|A|1F|B|C]]|D|@]|E|$]]|$1|U|3|V|5|H|7|1G|8|@]|D|@]|E|$I|J]]|$1|W|3|L|5|6|7|1H|8|@]|D|@]|E|$]]|$1|X|3|Y|5|H|7|1I|8|@]|D|@]|E|$I|J]]|$1|Z|3|10|5|6|7|1J|8|@]|D|@]|E|$]]|$1|11|3|12|5|H|7|1K|8|@]|D|@]|E|$I|J]]|$1|13|3|-4|5|6|7|1L|8|@]|D|@]|E|$]]]|14|$]]

<p><strong>1) If your HTML markup is:</strong></p>

<pre><code>&lt;input type="checkbox"  /&gt;
</code></pre>

<p>attr used:</p>

<pre><code>$(element).attr("checked"); // Will give you undefined as initial value of checkbox is not set
</code></pre>

<p>If prop is used:</p>

<pre><code>$(element).prop("checked"); // Will give you false whether or not initial value is set
</code></pre>

<p><strong>2) If your HTML markup is:</strong></p>

<pre><code> &lt;input type="checkbox"  checked="checked" /&gt;// May be like this also  checked="true"
</code></pre>

<p>attr used:</p>

<pre><code>$(element).attr("checked") // Will return checked whether it is checked="true"
</code></pre>

<p>Prop used:</p>

<pre><code>$(element).prop("checked") // Will return true whether checked="checked"
</code></pre>


blocks|key|1267672|text|上面的答案对我来说并没有起到作用。然而，这确实做到了：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1267673|<script+type="text/javascript">
++++$(document).ready(function(){

++++++++$("#li_13").click(function(){
++++++++++++if($("#agree").attr('checked')){
++++++++++++++++$("#saveForm").fadeIn();
++++++++++++}
++++++++++++else
++++++++++++{
++++++++++++++++$("#saveForm").fadeOut();
++++++++++++}
++++++++});
++++});
</script>|code-block|syntax|javascript|1267674|基本上，当元素#li_13被单击时，它会使用.attr('checked')函数检查元素#+agree+(即复选框)是否被选中。如果是，那么fadeIn+#saveForm元素，如果不是，就fadeOut+saveForm元素。|offset|length|style|CODE|1267675|entityMap^0|0|0|M|G|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@$I|R|J|S|K|L]]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

<p>The top answer didn't do it for me. This did though:</p>

<pre><code>&lt;script type="text/javascript"&gt;
    $(document).ready(function(){

        $("#li_13").click(function(){
            if($("#agree").attr('checked')){
                $("#saveForm").fadeIn();
            }
            else
            {
                $("#saveForm").fadeOut();
            }
        });
    });
&lt;/script&gt;
</code></pre>

<p>Basically when the element #li_13 is clicked, it checks if the element # agree (which is the checkbox) is checked by using the <code>.attr('checked')</code> function. If it is then fadeIn the #saveForm element, and if not fadeOut the saveForm element.</p>


blocks|key|4874725|text|此示例用于按钮。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4874726|尝试以下操作：|4874727|<input+type="button"+class="check"+id="checkall"+value="Check+All"+/>++&nbsp;+<input+type="button"+id="remove"+value="Delete"+/>+<br/>

<input+type="checkbox"+class="cb-element"++value="1"+/>+Checkbox++1+<br/>
<input+type="checkbox"+class="cb-element"++value="2"+/>+Checkbox++2+<br/>
<input+type="checkbox"+class="cb-element"++value="3"+/>+Checkbox++3+<br/>


$('#remove').attr('disabled',+'disabled');+

$(document).ready(function()+{++

++++$('.cb-element').click(function()+{

++++++++if($(this).prop('checked'))
++++++++{
++++++++++++$('#remove').attr('disabled',+false);
++++++++}
++++++++else
++++++++{
++++++++++++$('#remove').attr('disabled',+true);
++++++++}
++++});+++

++++$('.check:button').click(function()
{
++++var+checked+=+!$(this).data('checked');
++++$('input:checkbox').prop('checked',+checked);
++++$(this).data('checked',+checked);

++++if(checked+==+true)
++++{
++++++++$(this).val('Uncheck+All');
+++++++++$('#remove').attr('disabled',+false);
++++}

++++else+if(checked+==+false)
++++{
++++++++$(this).val('Check+All');
++++++++$('#remove').attr('disabled',+true);
++++}
});
});|code-block|syntax|javascript|4874728|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>This example is for button.</p>

<p>Try the following:</p>

<pre><code>&lt;input type="button" class="check" id="checkall" value="Check All" /&gt;  &amp;nbsp; &lt;input type="button" id="remove" value="Delete" /&gt; &lt;br/&gt;

&lt;input type="checkbox" class="cb-element"  value="1" /&gt; Checkbox  1 &lt;br/&gt;
&lt;input type="checkbox" class="cb-element"  value="2" /&gt; Checkbox  2 &lt;br/&gt;
&lt;input type="checkbox" class="cb-element"  value="3" /&gt; Checkbox  3 &lt;br/&gt;


$('#remove').attr('disabled', 'disabled'); 

$(document).ready(function() {  

    $('.cb-element').click(function() {

        if($(this).prop('checked'))
        {
            $('#remove').attr('disabled', false);
        }
        else
        {
            $('#remove').attr('disabled', true);
        }
    });   

    $('.check:button').click(function()
{
    var checked = !$(this).data('checked');
    $('input:checkbox').prop('checked', checked);
    $(this).data('checked', checked);

    if(checked == true)
    {
        $(this).val('Uncheck All');
         $('#remove').attr('disabled', false);
    }

    else if(checked == false)
    {
        $(this).val('Check All');
        $('#remove').attr('disabled', true);
    }
});
});
</code></pre>


blocks|key|810418|text|我使用的是：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|810419|+<input+type="checkbox"+id="isAgeSelected"+value="1"+/>+<br/>
+<input+type="textbox"+id="txtAge"+/>

+$("#isAgeSelected").is(':checked')+?+$("#txtAge").show()+:+$("#txtAge").hide();|code-block|syntax|javascript|810420|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>I am using this:</p>

<pre><code> &lt;input type="checkbox" id="isAgeSelected" value="1" /&gt; &lt;br/&gt;
 &lt;input type="textbox" id="txtAge" /&gt;

 $("#isAgeSelected").is(':checked') ? $("#txtAge").show() : $("#txtAge").hide();
</code></pre>


blocks|key|4029847|text|虽然你已经为你的问题提出了一个JavaScript解决方案(当checkbox为checked时显示一个textbox+)，但是这个问题可以通过css来解决。使用这种方法，您的表单适用于禁用了JavaScript的用户。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4029848|假设您有以下HTML：|4029849|<label+for="show_textbox">Show+Textbox</label>
<input+id="show_textbox"+type="checkbox"+/>
<input+type="text"+/>|code-block|syntax|javascript|4029850|您可以使用以下CSS来实现所需的功能：|4029851|+#show_textbox:not(:checked)+%2B+input[type=text]+{display:none;}|4029852|对于其他场景，您可能会考虑适当的CSS选择器。|4029853|Here+is+a+Fiddle+to+demonstrate+this+approach。|4029854|entityMap|0|LINK|mutability|MUTABLE|url|https://jsfiddle.net/gLztyn9x/4/^0|V|8|14|7|1G|7|0|0|0|0|0|0|0|19|0|0^^$0|@$1|2|3|4|5|6|7|12|8|@$9|13|A|14|B|C]|$9|15|A|16|B|C]|$9|17|A|18|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|19|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|1A|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|1B|8|@]|D|@]|E|$]]|$1|O|3|P|5|J|7|1C|8|@]|D|@]|E|$K|L]]|$1|Q|3|R|5|6|7|1D|8|@]|D|@]|E|$]]|$1|S|3|T|5|6|7|1E|8|@]|D|@$9|1F|A|1G|1|1H]]|E|$]]|$1|U|3|-4|5|6|7|1I|8|@]|D|@]|E|$]]]|V|$W|$5|X|Y|Z|E|$10|11]]]]

<p>Though you have proposed a JavaScript solution for your problem (displaying a <code>textbox</code> when a <code>checkbox</code> is <code>checked</code>), this problem could be solved <strong>just by css</strong>. With this approach, your form works for users who have disabled JavaScript.</p>

<p>Assuming that you have the following HTML:</p>

<pre><code>&lt;label for="show_textbox"&gt;Show Textbox&lt;/label&gt;
&lt;input id="show_textbox" type="checkbox" /&gt;
&lt;input type="text" /&gt;
</code></pre>

<p>You can use the following CSS to achieve the desired functionality:</p>

<pre><code> #show_textbox:not(:checked) + input[type=text] {display:none;}
</code></pre>

<p>For other scenarios, you may think of appropriate CSS selectors.</p>

<p><a href="https://jsfiddle.net/gLztyn9x/4/" rel="noreferrer" title="fiddle">Here is a Fiddle to demonstrate this approach</a>.</p>


blocks|key|810922|text|切换:+0/1或其他|type|unstyled|depth|inlineStyleRanges|entityRanges|data|810923|<input+type="checkbox"+id="nolunch"+/>
<input+id="checklunch+/>"

++++$('#nolunch').change(function+()+{
++++if+($(this).is(':checked'))+{
++++++++$('#checklunch').val('1');
++++};
++++if+($(this).is(':checked')+==+false)+{
++++++++$('#checklunch').val('0');
++++};
});|code-block|syntax|javascript|810924|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>Toggle: 0/1 or else</p>

<pre><code>&lt;input type="checkbox" id="nolunch" /&gt;
&lt;input id="checklunch /&gt;"

    $('#nolunch').change(function () {
    if ($(this).is(':checked')) {
        $('#checklunch').val('1');
    };
    if ($(this).is(':checked') == false) {
        $('#checklunch').val('0');
    };
});
</code></pre>


blocks|key|4875715|text|要对选中或取消选中的复选框执行操作，请单击。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4875716|​|4875717|$('#customCheck1').click(function()+{
++if+(this.checked)+{
++++console.log('checked');
++}+else+{
++++console.log('un-checked');
++}
});|code-block|syntax|javascript|4875718|<script+src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input+type="checkbox"+id="customCheck1">|4875719|4875720|编辑:尽管.checked属性可能还会返回其他类型变量，但它不是一个很好的编程表达式if+(boolean+==+true)。|offset|length|style|CODE|4875721|最好改用.prop("checked")。它仅返回true和false。|4875722|entityMap^0|0|0|0|0|0|5|8|16|K|0|4|G|P|4|U|5|0^^$0|@$1|2|3|4|5|6|7|V|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|W|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|X|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|F|7|Y|8|@]|9|@]|A|$G|H]]|$1|K|3|C|5|6|7|Z|8|@]|9|@]|A|$]]|$1|L|3|M|5|6|7|10|8|@$N|11|O|12|P|Q]|$N|13|O|14|P|Q]]|9|@]|A|$]]|$1|R|3|S|5|6|7|15|8|@$N|16|O|17|P|Q]|$N|18|O|19|P|Q]|$N|1A|O|1B|P|Q]]|9|@]|A|$]]|$1|T|3|-4|5|6|7|1C|8|@]|9|@]|A|$]]]|U|$]]

<p>To act on a checkbox being checked or unchecked on click.</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$('#customCheck1').click(function() {
  if (this.checked) {
    console.log('checked');
  } else {
    console.log('un-checked');
  }
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;

&lt;input type="checkbox" id="customCheck1"&gt;</code></pre>
</div>
</div>
</p>
<p>EDIT: Not a nice programming expression <code>if (boolean == true)</code> though <code>.checked</code> property might return other type variables as well..</p>
<p>It is better to use <code>.prop(&quot;checked&quot;)</code> instead. It returns <code>true</code> and <code>false</code> only.</p>


blocks|key|1271740|text|我认为这将是一个简单的问题|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1271741|$('#isAgeSelected').change(function()+{
++++if($(this).is(":checked"))+{
++++++++$('#txtAge').show();
++++}
else{
++++++++$('#txtAge').hide();
++++}++++++++++++++++++++++++++++++++++++++++++
});|code-block|syntax|javascript|1271742|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>I think it will be the simple one </p>

<pre><code>$('#isAgeSelected').change(function() {
    if($(this).is(":checked")) {
        $('#txtAge').show();
    }
else{
        $('#txtAge').hide();
    }                                          
});
</code></pre>


blocks|key|4875587|text|请尝试使用下面的代码检查复选框是否已选中或不是|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|4875588|$(document).ready(function(){

++++$("#isAgeSelected").on('change',function(){

++++if($("#isAgeSelected").is(':checked'))
++++++++$("#txtAge").show();++//+checked
++++else{
++++++++$("#txtAge").hide();++//+unchecked
++++}

+++});

});|code-block|syntax|javascript|4875589|entityMap^0|0|N|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

<p><strong>Please try below code to check checkbox is checked or not</strong> </p>

<pre><code>$(document).ready(function(){

    $("#isAgeSelected").on('change',function(){

    if($("#isAgeSelected").is(':checked'))
        $("#txtAge").show();  // checked
    else{
        $("#txtAge").hide();  // unchecked
    }

   });

});
</code></pre>


blocks|key|1268007|text|我确信这不是什么启示，但我没有在一个例子中看到所有的东西：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1268008|所有选中复选框的选择器(在页面上)：|1268009|$('input[type=checkbox]:checked')|code-block|syntax|javascript|1268010|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>I'm sure it's not some revelation, but I didn't see it all in one example:</p>

<p>Selector for all checked checkboxes(on the page):</p>

<pre><code>$('input[type=checkbox]:checked')
</code></pre>


blocks|key|4873945|text|我在Firefox+9.0.1中验证了以下方法可以捕获checkbox+post更改的状态：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4873946|$("#mycheckbox").change(function()+{
++++var+value+=+$(this).prop("checked")+?+'true'+:+'false';+++++++++++++++++++++
++++alert(value);
});|code-block|syntax|javascript|4873947|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>I verified in Firefox 9.0.1 that the following works for catching the state of a checkbox post change:</p>

<pre><code>$("#mycheckbox").change(function() {
    var value = $(this).prop("checked") ? 'true' : 'false';                     
    alert(value);
});
</code></pre>


blocks|key|4874288|text|包括来自本地文件系统的jQuery。我用的是谷歌的CDN，也有很多CDN可供选择。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4874289|<script+src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>|code-block|syntax|javascript|4874290|只要单击mycheck类中的复选框，代码就会执行。如果选中了当前单击的复选框，则将禁用所有其他复选框并启用当前的复选框。如果当前复选框未选中，则会再次启用所有复选框以进行复选。|style|CODE|4874291|<script+type="text/javascript">
++++$(document).ready(function()+{

++++++++var+checkbox_selector+=+'.mycheck+input[type=checkbox]';

++++++++$(checkbox_selector).click(function()+{
++++++++++++if+($($(this)).is(':checked'))+{

++++++++++++++++//+Disable+all+checkboxes
++++++++++++++++$(checkbox_selector).attr('disabled',+'disabled');

++++++++++++++++//+Enable+current+one
++++++++++++++++$($(this)).removeAttr('disabled');
++++++++++++}
++++++++++++else+{
++++++++++++++++//+If+unchecked+open+all+checkbox
++++++++++++++++$(checkbox_selector).removeAttr('disabled');
++++++++++++}
++++++++});
++++});
</script>|4874292|要测试的简单表单|4874293|<form+method="post"+action="">
++++<div+class="mycheck">
++++++++<input+type="checkbox"+value="1"+/>+Television
++++++++<input+type="checkbox"+value="2"+/>+Computer
++++++++<input+type="checkbox"+value="3"+/>+Laptop
++++++++<input+type="checkbox"+value="4"+/>+Camera
++++++++<input+type="checkbox"+value="5"+/>+Music+Systems
++++</div>
</form>|4874294|输出屏幕：|4874295|​|4874296|📷|atomic|4874297|4874298|entityMap|0|LINK|mutability|MUTABLE|url|http://en.wikipedia.org/wiki/Content_delivery_network|1|IMAGE|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/ad824ba3fdfb9deea973042634f94dc4.png|imageAlt^0|P|3|0|0|0|4|7|0|0|0|0|0|0|0|1|1|0|0^^$0|@$1|2|3|4|5|6|7|1E|8|@]|9|@$A|1F|B|1G|1|1H]]|C|$]]|$1|D|3|E|5|F|7|1I|8|@]|9|@]|C|$G|H]]|$1|I|3|J|5|6|7|1J|8|@$A|1K|B|1L|K|L]]|9|@]|C|$]]|$1|M|3|N|5|F|7|1M|8|@]|9|@]|C|$G|H]]|$1|O|3|P|5|6|7|1N|8|@]|9|@]|C|$]]|$1|Q|3|R|5|F|7|1O|8|@]|9|@]|C|$G|H]]|$1|S|3|T|5|6|7|1P|8|@]|9|@]|C|$]]|$1|U|3|V|5|6|7|1Q|8|@]|9|@]|C|$]]|$1|W|3|X|5|Y|7|1R|8|@]|9|@$A|1S|B|1T|1|1U]]|C|$]]|$1|Z|3|V|5|6|7|1V|8|@]|9|@]|C|$]]|$1|10|3|-4|5|6|7|1W|8|@]|9|@]|C|$]]]|11|$12|$5|13|14|15|C|$16|17]]|18|$5|19|14|1A|C|$1B|1C|1D|-4]]]]

<p>Include jQuery from the local file system. I used Google's <a href="http://en.wikipedia.org/wiki/Content_delivery_network" rel="noreferrer">CDN</a>, and there are also many CDNs to choose from.</p>

<pre><code>&lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"&gt;&lt;/script&gt;
</code></pre>

<p>The code will execute as soon as a checkbox inside <code>mycheck</code> class is clicked. If the current clicked checkbox is checked then it will disable all others and enable the current one. If the current one is unchecked, it will again enable all checkboxes for rechecking.</p>

<pre><code>&lt;script type="text/javascript"&gt;
    $(document).ready(function() {

        var checkbox_selector = '.mycheck input[type=checkbox]';

        $(checkbox_selector).click(function() {
            if ($($(this)).is(':checked')) {

                // Disable all checkboxes
                $(checkbox_selector).attr('disabled', 'disabled');

                // Enable current one
                $($(this)).removeAttr('disabled');
            }
            else {
                // If unchecked open all checkbox
                $(checkbox_selector).removeAttr('disabled');
            }
        });
    });
&lt;/script&gt;
</code></pre>

<p>Simple form to test</p>

<pre><code>&lt;form method="post" action=""&gt;
    &lt;div class="mycheck"&gt;
        &lt;input type="checkbox" value="1" /&gt; Television
        &lt;input type="checkbox" value="2" /&gt; Computer
        &lt;input type="checkbox" value="3" /&gt; Laptop
        &lt;input type="checkbox" value="4" /&gt; Camera
        &lt;input type="checkbox" value="5" /&gt; Music Systems
    &lt;/div&gt;
&lt;/form&gt;
</code></pre>

<p>Output screen:</p>

<p><img src="https://i.stack.imgur.com/SM7V9.png" alt="Enter image description here"></p>


blocks|key|1267778|text|if($("#checkkBoxId").is(':checked')){
++alert("Checked=true");
}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1267779|或|unstyled|1267780|if($("#checkkBoxId").attr('checked')+==+true){
++alert("checked=true");
}|1267781|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|L|8|@]|9|@]|A|$]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$B|C]]|$1|I|3|-4|5|F|7|N|8|@]|9|@]|A|$]]]|J|$]]

<pre><code>if($("#checkkBoxId").is(':checked')){
  alert("Checked=true");
}
</code></pre>

<p>or</p>

<pre><code>if($("#checkkBoxId").attr('checked') == true){
  alert("checked=true");
}
</code></pre>


blocks|key|4029330|text|input+type="checkbox"的checked属性使用defaultChecked属性进行映射，而不是使用checked属性进行映射。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|BOLD|entityRanges|data|4029331|因此，在未选中复选框的情况下在页面中执行某些操作时，请改用prop()方法。它获取属性值，并随着checkbox的状态更改而更改。|4029332|在这些情况下使用attr()或getAttribute(纯JavaScript)不是正确的做法。|4029333|如果elem是相关的复选框，则执行类似以下操作来获取该值：|4029334|elem.checked|code-block|syntax|javascript|4029335|或|4029336|$(elem).prop('checked')|4029337|entityMap^0|0|L|M|7|X|E|1N|7|1I|3|0|T|6|0|8|5|F|C|0|2|4|0|0|0|0^^$0|@$1|2|3|4|5|6|7|X|8|@$9|Y|A|Z|B|C]|$9|10|A|11|B|C]|$9|12|A|13|B|C]|$9|14|A|15|B|C]|$9|16|A|17|B|D]]|E|@]|F|$]]|$1|G|3|H|5|6|7|18|8|@$9|19|A|1A|B|C]]|E|@]|F|$]]|$1|I|3|J|5|6|7|1B|8|@$9|1C|A|1D|B|C]|$9|1E|A|1F|B|C]]|E|@]|F|$]]|$1|K|3|L|5|6|7|1G|8|@$9|1H|A|1I|B|C]]|E|@]|F|$]]|$1|M|3|N|5|O|7|1J|8|@]|E|@]|F|$P|Q]]|$1|R|3|S|5|6|7|1K|8|@]|E|@]|F|$]]|$1|T|3|U|5|O|7|1L|8|@]|E|@]|F|$P|Q]]|$1|V|3|-4|5|6|7|1M|8|@]|E|@]|F|$]]]|W|$]]

<p>The <code>checked</code> attribute of an <code>input type="checkbox"</code> is mapped with the <code>defaultChecked</code> property, <strong>not</strong> with the <code>checked</code> property. </p>

<p>So when doing something in a page when a checkbox is checked on uncheked, use the <code>prop()</code> method instead. It fetches the property value and changes as the state of the checkbox changes. </p>

<p>Using <code>attr(</code>) or <code>getAttribute</code>(in pure JavaScript) in these cases are not the proper way of doing things. </p>

<p>if <code>elem</code> is the concerned checkbox then do something like this to fetch the value:</p>

<pre><code>elem.checked
</code></pre>

<p>or</p>

<pre><code>$(elem).prop('checked')
</code></pre>


blocks|key|810736|text|自动化|type|unstyled|depth|inlineStyleRanges|entityRanges|data|810737|$(document).ready(function()
{
++++$('#isAgeSelected').change(function()
++++{
++++++++alert(+'value+='+%2B+$('#chkSelect').attr('checked')+);
++++});
});|code-block|syntax|javascript|810738|HTML|810739|<b>+<input+type="isAgeSelected"+id="chkSelect"+/>+Age+Check+</b>

<br/><br/>

<input+type="button"+id="btnCheck"+value="check"+/>|810740|jQuery|810741|$(document).ready(function()
{
++++$('#btnCheck').click(function()
++++{
++++++++var+isChecked+=+$('#isAgeSelected').attr('checked');

++++++++if+(isChecked+==+'checked')
++++++++++++alert('check-box+is+checked');
++++++++else
++++++++++++alert('check-box+is+not+checked');
++++})
});|810742|Ajax|offset|length|style|BOLD|810743|function+check()
{
++++if+(isAgeSelected())
++++++++alert('check-box+is+checked');
++++else
++++++++alert('check-box+is+not+checked');
}

function+isAgeSelected()
{
++++return+($get("isAgeSelected").checked+==+true);
}|810744|entityMap^0|0|0|0|0|0|0|0|4|0|0^^$0|@$1|2|3|4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|Z|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|10|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|11|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|12|8|@]|9|@]|A|$]]|$1|M|3|N|5|D|7|13|8|@]|9|@]|A|$E|F]]|$1|O|3|P|5|6|7|14|8|@$Q|15|R|16|S|T]]|9|@]|A|$]]|$1|U|3|V|5|D|7|17|8|@]|9|@]|A|$E|F]]|$1|W|3|-4|5|6|7|18|8|@]|9|@]|A|$]]]|X|$]]

<h3>Automated</h3>

<pre><code>$(document).ready(function()
{
    $('#isAgeSelected').change(function()
    {
        alert( 'value =' + $('#chkSelect').attr('checked') );
    });
});
</code></pre>

<h3>HTML</h3>

<pre><code>&lt;b&gt; &lt;input type="isAgeSelected" id="chkSelect" /&gt; Age Check &lt;/b&gt;

&lt;br/&gt;&lt;br/&gt;

&lt;input type="button" id="btnCheck" value="check" /&gt;
</code></pre>

<h3>jQuery</h3>

<pre><code>$(document).ready(function()
{
    $('#btnCheck').click(function()
    {
        var isChecked = $('#isAgeSelected').attr('checked');

        if (isChecked == 'checked')
            alert('check-box is checked');
        else
            alert('check-box is not checked');
    })
});
</code></pre>

<p><strong>Ajax</strong></p>

<pre><code>function check()
{
    if (isAgeSelected())
        alert('check-box is checked');
    else
        alert('check-box is not checked');
}

function isAgeSelected()
{
    return ($get("isAgeSelected").checked == true);
}
</code></pre>


blocks|key|4029172|text|这是我想要有效地做这样的事情所需要的最少的代码。我发现这个方法很有用；它返回一个复选框被选中的数组，然后您可以使用它们的值(这个解决方案使用jQuery)：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4029173|//+This+is+how+you+get+them
var+output+=+"";
var+checkedBoxes+=+$("DivCheckBoxesAreIn").children("input:checked");
if(checkedBoxes.length+<=+0)+{
++++alert('Please+select+check+boxes');
++++return+false;
};

//+And+this+is+how+you+use+them:
checkedBoxes.each(function()+{
++++output+%2B=++this.value+%2B+",+";
};|code-block|syntax|javascript|4029174|打印"output“会给出一个逗号分隔的值列表。|4029175|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>This is the minimal amount of code I think I needed to do something like this effectively. I found this method to be useful; it returns an array of the check boxes that are checked and then you can use their value (this solution uses jQuery):</p>

<pre><code>// This is how you get them
var output = "";
var checkedBoxes = $("DivCheckBoxesAreIn").children("input:checked");
if(checkedBoxes.length &lt;= 0) {
    alert('Please select check boxes');
    return false;
};

// And this is how you use them:
checkedBoxes.each(function() {
    output +=  this.value + ", ";
};
</code></pre>

<p>Printing "output" will give you a comma-separated list of your values.</p>


blocks|key|4875750|text|​|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4875751|$(document).on("click","#isAgeSelected",function(){
++if($(this).prop("checked")+==+true){
++++$("#txtAge").show();
++}
++else+if($(this).prop("checked")+==+false){
++++$("#txtAge").hide();
++}
});|code-block|syntax|javascript|4875752|<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">
<input+type="text"+name="age"+placeholder="Please+enter+age"+/>
</div>|4875753|4875754|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|M|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|I|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|J|3|-4|5|6|7|P|8|@]|9|@]|A|$]]]|K|$]]

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).on("click","#isAgeSelected",function(){
  if($(this).prop("checked") == true){
    $("#txtAge").show();
  }
  else if($(this).prop("checked") == false){
    $("#txtAge").hide();
  }
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

 &lt;input type="checkbox" id="isAgeSelected"/&gt;

&lt;div id="txtAge" style="display:none"&gt;
&lt;input type="text" name="age" placeholder="Please enter age" /&gt;
&lt;/div&gt;</code></pre>
</div>
</div>
</p>


blocks|key|1268359|text|只需像下面这样使用它|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1268360|+$('#isAgeSelected').change(function()+{
+++++if+($(this).is(":checked"))+{+//+or+if($("#isAgeSelected").attr('checked')+==+true){
+++++++++$('#txtAge').show();
+++++}+else+{
+++++++++$('#txtAge').hide();
+++++}
+});|code-block|syntax|javascript|1268361|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>Simply use it like below</p>

<pre><code> $('#isAgeSelected').change(function() {
     if ($(this).is(":checked")) { // or if($("#isAgeSelected").attr('checked') == true){
         $('#txtAge').show();
     } else {
         $('#txtAge').hide();
     }
 });
</code></pre>


blocks|key|811475|text|使用纯JavaScript|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|811476|let+checkbox+=+document.getElementById('checkboxID');

if(checkbox.checked)+{
++alert('is+checked');
}+else+{
++alert('not+checked+yet');
}|code-block|syntax|javascript|811477|entityMap^0|3|A|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

<p>Using pure <strong>JavaScript</strong>:</p>

<pre><code>let checkbox = document.getElementById('checkboxID');

if(checkbox.checked) {
  alert('is checked');
} else {
  alert('not checked yet');
}
</code></pre>


blocks|key|809703|text|我遇到了同样的问题，发布的解决方案似乎都不起作用，然后我发现这是因为ASP.NET将CheckBox控件呈现为内部包含输入的跨度，所以CheckBox+ID实际上是跨度的ID，而不是输入，所以您应该使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|809704|$('#isAgeSelected+input')|code-block|syntax|javascript|809705|而不是|809706|$('#isAgeSelected')|809707|然后上面列出的所有方法都应该有效。|809708|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|S|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

<p>I was having the same problem and none of the posted solutions seemed to work and then I found out that it's because ASP.NET renders the CheckBox control as a SPAN with INPUT inside, so the CheckBox ID is actually an ID of a SPAN, not an INPUT, so you should use:</p>

<pre><code>$('#isAgeSelected input')
</code></pre>

<p>rather than</p>

<pre><code>$('#isAgeSelected')
</code></pre>

<p>and then all methods listed above should work.</p>


blocks|key|1271075|text|这是一个例子，其中包括在页面加载时，对显示/隐藏进行初始化，以匹配复选框的状态；考虑到当您刷新页面时，firefox会记住复选框的状态，但不会记住显示/隐藏元素的状态。|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|1271076|$(function()+{
++++//+initialise+visibility+when+page+is+loaded
++++$('tr.invoiceItemRow').toggle($('#showInvoiceItems').attr('checked'));
++++//+attach+click+handler+to+checkbox
++++$('#showInvoiceItems').click(function(){+$('tr.invoiceItemRow').toggle(this.checked);})
});|code-block|syntax|javascript|1271077|(从这个问题的其他答案中获得帮助)|1271078|entityMap^0|C|4|Q|1M|0|0|0|H|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]|$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|T|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|U|8|@$9|V|A|W|B|C]]|D|@]|E|$]]|$1|M|3|-4|5|6|7|X|8|@]|D|@]|E|$]]]|N|$]]

<p>Here's an example that includes <strong>initialising</strong> the show/hide to match the state of the checkbox when the <strong>page loads</strong>; taking account of the fact that firefox <em>remembers the state of checkboxes</em> when you refresh the page, but <em>won't</em> remember the state of the shown/hidden elements.</p>

<pre><code>$(function() {
    // initialise visibility when page is loaded
    $('tr.invoiceItemRow').toggle($('#showInvoiceItems').attr('checked'));
    // attach click handler to checkbox
    $('#showInvoiceItems').click(function(){ $('tr.invoiceItemRow').toggle(this.checked);})
});
</code></pre>

<p>(with help from other answers on this question)</p>


blocks|key|4028998|text|这是我的变通方法：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4028999|$('#vcGoButton').click(function+()+{
++++var+buttonStatus+=+$('#vcChangeLocation').prop('checked');
++++console.log("Status+is+"+%2B+buttonStatus);
++++if+(buttonStatus)+{
++++++++var+address+=+$('#vcNewLocation').val();
++++++++var+cabNumber+=+$('#vcVehicleNumber').val();
++++++++$.get('postCabLocation.php',
++++++++++++++{address:+address,+cabNumber:+cabNumber},
++++++++++++++function(data)+{
++++++++++++++++++console.log("Changed+vehicle+"+%2B+cabNumber+%2B+"+location+to+"+%2B+address+);
++++++++++++++});
++++}
++++else+{
++++++++console.log("VC+go+button+clicked,+but+no+location+action");
++++}
});|code-block|syntax|javascript|4029000|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>This was my workaround:</p>

<pre><code>$('#vcGoButton').click(function () {
    var buttonStatus = $('#vcChangeLocation').prop('checked');
    console.log("Status is " + buttonStatus);
    if (buttonStatus) {
        var address = $('#vcNewLocation').val();
        var cabNumber = $('#vcVehicleNumber').val();
        $.get('postCabLocation.php',
              {address: address, cabNumber: cabNumber},
              function(data) {
                  console.log("Changed vehicle " + cabNumber + " location to " + address );
              });
    }
    else {
        console.log("VC go button clicked, but no location action");
    }
});
</code></pre>


blocks|key|810184|text|使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|810185|$(this).toggle($("input:checkbox",+$(this))[0].checked);|code-block|syntax|javascript|810186|当您选择脱离上下文时，请记住您需要访问该复选框。|810187|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>Use:</p>

<pre><code>$(this).toggle($("input:checkbox", $(this))[0].checked);
</code></pre>

<p>When you are selecting out of context, remember you need the [0] to access the checkbox.</p>


blocks|key|4874760|text|Setter：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4874761|$("#chkmyElement")[0].checked+=+true;|code-block|syntax|javascript|4874762|Getter：|4874763|if($("#chkmyElement")[0].checked)+{
+++alert("enabled");
}+else+{
+++alert("disabled");
}|4874764|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>Setter:</p>

<pre><code>$("#chkmyElement")[0].checked = true;
</code></pre>

<p>Getter:</p>

<pre><code>if($("#chkmyElement")[0].checked) {
   alert("enabled");
} else {
   alert("disabled");
}
</code></pre>


blocks|key|810820|text|实际上，我更喜欢change事件。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|810821|$('#isAgeSelected').change(function()+{
++++$("#txtAge").toggle(this.checked);
});|code-block|syntax|javascript|810822|Demo+Fiddle|810823|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/5udtC/6913/^0|8|6|0|0|0|B|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@$9|V|A|W|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|X|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|Y|8|@]|D|@$9|Z|A|10|1|11]]|E|$]]|$1|M|3|-4|5|6|7|12|8|@]|D|@]|E|$]]]|N|$O|$5|P|Q|R|E|$S|T]]]]

<p>I would actually prefere the <code>change</code> event.</p>

<pre><code>$('#isAgeSelected').change(function() {
    $("#txtAge").toggle(this.checked);
});
</code></pre>

<p><a href="http://jsfiddle.net/5udtC/6913/" rel="nofollow">Demo Fiddle</a></p>


blocks|key|810949|text|选择器返回多个对象，它必须接受数组中的第一项：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|810950|//+Collection
var+chckremember+=+$("#chckremember");


//+Result+boolen
var+ischecked=chckremember[0].checked;|code-block|syntax|javascript|810951|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>A selector returns multiple objects, and it must take the first item in the array:</p>

<pre><code>// Collection
var chckremember = $("#chckremember");


// Result boolen
var ischecked=chckremember[0].checked;
</code></pre>


blocks|key|1271829|text|尝尝这个,|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1271830|$('#isAgeSelected').click(function()+{
++++if(this.checked){
++++++++$("#txtAge").show();
++++}+else{
++++++++$("#txtAge").hide();
++++}+
});|code-block|syntax|javascript|1271831|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>Try this, </p>

<pre><code>$('#isAgeSelected').click(function() {
    if(this.checked){
        $("#txtAge").show();
    } else{
        $("#txtAge").hide();
    } 
});
</code></pre>


blocks|key|4875330|text|我使用的是jQuery+1.11.1，在设置和读取复选框值时也遇到了问题。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4875331|我最终通过这两个函数解决了这个问题：|4875332|function+setCheckboxValue(checkBoxId,+checked)+{
++++if+(checkBoxId+&&+(checked+===+true+%7C%7C+checked+===+false))+{
++++++++var+elem+=+$('#'+%2B+checkBoxId);
++++++++if+(checked+===+true)+{
++++++++++++elem.attr('checked',+'checked');
++++++++}+else+{
++++++++++++elem.removeAttr('checked');
++++++++}
++++}
}

function+isChecked(checkBoxId)+{
++++return+$('#'+%2B+checkBoxId).attr('checked')+!=+null;
}|code-block|syntax|javascript|4875333|它可能看起来有点脏，但它解决了我在不同类型的浏览器之间遇到的所有有线问题。|4875334|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|N|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|O|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|P|8|@]|9|@]|A|$]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>I'm using jQuery 1.11.1 and I had troubles with setting and reading checkbox value as well.</p>

<p>I finally solved it by these two functions:</p>

<pre><code>function setCheckboxValue(checkBoxId, checked) {
    if (checkBoxId &amp;&amp; (checked === true || checked === false)) {
        var elem = $('#' + checkBoxId);
        if (checked === true) {
            elem.attr('checked', 'checked');
        } else {
            elem.removeAttr('checked');
        }
    }
}

function isChecked(checkBoxId) {
    return $('#' + checkBoxId).attr('checked') != null;
}
</code></pre>

<p>It might looks a little bit dirty but it solves all the wired issue I had among different types of browsers.</p>


blocks|key|1272034|text|你可以试试这段代码：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1272035|$('#isAgeSelected').click(function(){
+++console.log(this.checked);
+++if(this.checked+==+true)+{
++++++++$("#txtAge").show();
++++}+else+{
+++++++$("#txtAge").hide();
+++}
});|code-block|syntax|javascript|1272036|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>You Can Try This code: </p>

<pre><code>$('#isAgeSelected').click(function(){
   console.log(this.checked);
   if(this.checked == true) {
        $("#txtAge").show();
    } else {
       $("#txtAge").hide();
   }
});
</code></pre>


blocks|key|810125|text|if(+undefined+==+$('#isAgeSelected').attr('checked')+)+{
++++$("#txtAge").hide();
}+else+{
++++$("#txtAge").show();
}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|810126|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>if( undefined == $('#isAgeSelected').attr('checked') ) {
    $("#txtAge").hide();
} else {
    $("#txtAge").show();
}
</code></pre>


blocks|key|1272120|text|您好，您可以使用普通的Javascript，如下所示：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1272121|​|1272122|document.getElementById('checkboxOption').addEventListener('click',++++++
+++event+=>+console.log(event.target.checked)
);|code-block|syntax|javascript|1272123|<label><input+type="checkbox"+id="checkboxOption">Check+Option</label>|1272124|1272125|entityMap^0|B|A|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@$9|S|A|T|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|U|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|V|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|J|7|W|8|@]|D|@]|E|$K|L]]|$1|O|3|G|5|6|7|X|8|@]|D|@]|E|$]]|$1|P|3|-4|5|6|7|Y|8|@]|D|@]|E|$]]]|Q|$]]

<p>Hi you can use plain <code>Javascript</code>, like so:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>document.getElementById('checkboxOption').addEventListener('click',      
   event =&gt; console.log(event.target.checked)
);</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;label&gt;&lt;input type="checkbox" id="checkboxOption"&gt;Check Option&lt;/label&gt;</code></pre>
</div>
</div>
</p>


blocks|key|4875784|text|jQuery+prop()方法提供了一种简单、有效和可靠的方法来跟踪复选框的当前状态。它在所有条件下都工作得很好，因为每个复选框都有一个checked属性，该属性指定其选中或未选中状态。|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|4875785|请不要用选中属性来误解它。checked属性仅定义复选框的初始状态，而不定义当前状态。让我们看看它是如何工作的：|4875786|<script>
++++$(document).ready(function(){
++++++++$('input[type="checkbox"]').click(function(){
++++++++++++if($(this).prop("checked")+==+true){
++++++++++++++++console.log("Checkbox+is+checked.");
++++++++++++}
++++++++++++else+if($(this).prop("checked")+==+false){
++++++++++++++++console.log("Checkbox+is+unchecked.");
++++++++++++}
++++++++});
++++});
</script>|code-block|syntax|javascript|4875787|有关详细说明，请访问jQuery+prop()|4875788|但是，您也可以使用jQuery的is()函数。|4875789|if($("#isAgeSelected").is(':checked'))
++++$("#txtAge").show();++//+Age+is+selected+-+Show+the+Age
else
++++$("#txtAge").hide();++//+Age+is+not+selected+-+Hide+the+Age|4875790|entityMap|0|LINK|mutability|MUTABLE|url|https://www.tutorialrepublic.com/faq/how-to-check-a-checkbox-is-checked-or-not-using-jquery.php^0|0|D|1W|9|0|0|0|A|D|0|0|G|6|0|0^^$0|@$1|2|3|4|5|6|7|10|8|@$9|11|A|12|B|C]|$9|13|A|14|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|15|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|16|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|17|8|@]|D|@$9|18|A|19|1|1A]]|E|$]]|$1|O|3|P|5|6|7|1B|8|@$9|1C|A|1D|B|C]]|D|@]|E|$]]|$1|Q|3|R|5|J|7|1E|8|@]|D|@]|E|$K|L]]|$1|S|3|-4|5|6|7|1F|8|@]|D|@]|E|$]]]|T|$U|$5|V|W|X|E|$Y|Z]]]]

<p>The <strong>jQuery prop()</strong> method provides a simple, effective, and reliable way to track down the current status of a checkbox. It works pretty well in all conditions because every checkbox has a <strong>checked property</strong> which specifies its checked or unchecked status.</p>
<p>Do not misunderstand it with the checked attribute. The checked attribute only define the initial state of a checkbox, and not the current state. Let's see how it works:</p>
<pre><code>&lt;script&gt;
    $(document).ready(function(){
        $('input[type=&quot;checkbox&quot;]').click(function(){
            if($(this).prop(&quot;checked&quot;) == true){
                console.log(&quot;Checkbox is checked.&quot;);
            }
            else if($(this).prop(&quot;checked&quot;) == false){
                console.log(&quot;Checkbox is unchecked.&quot;);
            }
        });
    });
&lt;/script&gt;
</code></pre>
<p>For Detailed Explaination: <a href="https://www.tutorialrepublic.com/faq/how-to-check-a-checkbox-is-checked-or-not-using-jquery.php" rel="noreferrer">jQuery prop()</a></p>
<p>However, you can use the <strong>is() function</strong> of jQuery too.</p>
<pre><code>if($(&quot;#isAgeSelected&quot;).is(':checked'))
    $(&quot;#txtAge&quot;).show();  // Age is selected - Show the Age
else
    $(&quot;#txtAge&quot;).hide();  // Age is not selected - Hide the Age
</code></pre>


blocks|key|4029972|text|这个解决方案怎么样？|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4029973|$("#txtAge")[
++++$("#isAgeSelected").is(':checked')+?
++++'show'+:
++++'hide'
]();|code-block|syntax|javascript|4029974|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>What about this solution?</p>

<pre><code>$("#txtAge")[
    $("#isAgeSelected").is(':checked') ?
    'show' :
    'hide'
]();
</code></pre>


blocks|key|811430|text|我需要检查checkbox的checked属性，并使用jQuery基于checked属性执行操作。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|811431|E.X+-|811432|1)在加载时运行以获取复选框值如果选中年龄复选框，则需要显示一个文本框以输入年龄，否则隐藏文本框。|811433|2)如果年龄复选框被选中，那么我需要显示一个文本框来输入年龄，否则使用checkbox的单击事件隐藏文本框。|811434|默认情况下，代码不会返回：|offset|length|style|BOLD|811435|尝试以下操作：|811436|<html>
++++++++<head>
++++++++++++<script+src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
++++++++</head>
++++++++<body>
++++++++++++<h1>Jquery+Demo</h1>
++++++++++++<input+type="checkbox"+name="isAge"+checked+id="isAge">+isAge+<br/>
++++++++++++<div+id="Age"+style="display:none">
++++++++++++++<label>Enter+your+age</label>
++++++++++++++<input+type="number"+name="age">
++++++++++++</div>
++++++++++++<script+type="text/javascript">
++++++++++++if(document.getElementById('isAge').checked)+{
++++++++++++++++$('#Age').show();
++++++++++++}+else+{
++++++++++++++++$('#Age').hide();
++++++++++++}+++
++++++++++++$('#isAge').click(function()+{
++++++++++++++++if(document.getElementById('isAge').checked)+{
++++++++++++++++++++$('#Age').show();
++++++++++++++++}+else+{
++++++++++++++++++++$('#Age').hide();
++++++++++++++++}
++++++++++++});+
++++++++++++</script>
++++++++</body>
++++</html>|code-block|syntax|javascript|811437|这是一个修改后的版本：https://jsfiddle.net/sedhal/0hygLtrz/7/|811438|entityMap|0|LINK|mutability|MUTABLE|url|https://jsfiddle.net/sedhal/0hygLtrz/7/^0|0|0|0|0|C|1|0|0|0|B|13|0|0^^$0|@$1|2|3|4|5|6|7|14|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|15|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|16|8|@]|9|@]|A|$]]|$1|F|3|G|5|6|7|17|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|18|8|@$J|19|K|1A|L|M]]|9|@]|A|$]]|$1|N|3|O|5|6|7|1B|8|@]|9|@]|A|$]]|$1|P|3|Q|5|R|7|1C|8|@]|9|@]|A|$S|T]]|$1|U|3|V|5|6|7|1D|8|@]|9|@$J|1E|K|1F|1|1G]]|A|$]]|$1|W|3|-4|5|6|7|1H|8|@]|9|@]|A|$]]]|X|$Y|$5|Z|10|11|A|$12|13]]]]

<p>I need to check the checked property of a checkbox and perform an action based on the checked property using jQuery. </p>

<p>E.X - </p>

<p>1) Run On load to get checkbox value if the age checkbox is checked, then I need to show a text box to enter age, else hide the text box. </p>

<p>2) if the age checkbox is checked, then I need to show a text box to enter age, else hide the text box using click event of checkbox. </p>

<p><strong>so code not returns false by default:</strong> </p>

<p>Try the following:</p>

<pre><code>&lt;html&gt;
        &lt;head&gt;
            &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;
        &lt;/head&gt;
        &lt;body&gt;
            &lt;h1&gt;Jquery Demo&lt;/h1&gt;
            &lt;input type="checkbox" name="isAge" checked id="isAge"&gt; isAge &lt;br/&gt;
            &lt;div id="Age" style="display:none"&gt;
              &lt;label&gt;Enter your age&lt;/label&gt;
              &lt;input type="number" name="age"&gt;
            &lt;/div&gt;
            &lt;script type="text/javascript"&gt;
            if(document.getElementById('isAge').checked) {
                $('#Age').show();
            } else {
                $('#Age').hide();
            }   
            $('#isAge').click(function() {
                if(document.getElementById('isAge').checked) {
                    $('#Age').show();
                } else {
                    $('#Age').hide();
                }
            }); 
            &lt;/script&gt;
        &lt;/body&gt;
    &lt;/html&gt;
</code></pre>

<p>Here is a modified version : <a href="https://jsfiddle.net/sedhal/0hygLtrz/7/" rel="nofollow noreferrer">https://jsfiddle.net/sedhal/0hygLtrz/7/</a></p>


blocks|key|811382|text|如果您需要知道在纯javascript中是否选中了复选框，您应该使用以下代码。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|811383|let+checkbox+=document.getElementById('myCheckboxId');
if(checkbox.checked)+{
++++alert("element+is+checked");
}+else+{
++++alert("element+is++ot+checked");
}|code-block|syntax|javascript|811384|entityMap^0|9|A|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

<p>In case you need to know if a checkbox is checked in pure <code>javascript</code> you should use this code .  </p>

<pre><code>let checkbox =document.getElementById('myCheckboxId');
if(checkbox.checked) {
    alert("element is checked");
} else {
    alert("element is  ot checked");
}
</code></pre>


blocks|key|4030340|text|在纯js中，复选框状态更易于阅读。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4030341|isAgeSelected.checked|code-block|syntax|javascript|4030342|​|4030343|function+check()+{
++txtAge.style.display=+isAgeSelected.checked+?+'block':'none';
}|4030344|<script+src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

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

<button+onclick="check()">Check</button>

<div+id="txtAge"+style="display:none">
Age+is+selected
</div>|4030345|4030346|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|Q|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|R|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|S|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|M|3|H|5|6|7|U|8|@]|9|@]|A|$]]|$1|N|3|-4|5|6|7|V|8|@]|9|@]|A|$]]]|O|$]]

<p>In pure js checkbox state is easier to read</p>

<pre><code>isAgeSelected.checked
</code></pre>

<p><div class="snippet" data-lang="js" data-hide="true" data-console="true" data-babel="false">
<div class="snippet-code snippet-currently-hidden">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function check() {
  txtAge.style.display= isAgeSelected.checked ? 'block':'none';
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

Age &lt;input type="checkbox" id="isAgeSelected"/&gt;

&lt;button onclick="check()"&gt;Check&lt;/button&gt;

&lt;div id="txtAge" style="display:none"&gt;
Age is selected
&lt;/div&gt;</code></pre>
</div>
</div>
</p>


blocks|key|1267677|text|if(+undefined+==+$('#isAgeSelected').attr('checked')+)+{
++++$("#txtAge").hide();
}+else+{
++++$("#txtAge").show();
}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1267678|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

blocks|key|811046|text|对于较旧版本的jQuery，我必须使用以下命令：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|811047|$('#change_plan').live('click',+function()+{
+++++var+checked+=+$('#change_plan').attr('checked');
+++++if(checked)+{
++++++++++//Code+++++++
+++++}
+++++else+{
++++++++++//Code+++++++
+++++}
});|code-block|syntax|javascript|811048|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>For older versions of jQuery, I had to use following,</p>

<pre><code>$('#change_plan').live('click', function() {
     var checked = $('#change_plan').attr('checked');
     if(checked) {
          //Code       
     }
     else {
          //Code       
     }
});
</code></pre>


blocks|key|4874892|text|如果您需要使用CSS类作为jQuery选择器，您可以执行以下操作：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4874893|$(document).ready(function+()+{
++++++++$('.myOptionCheckbox').change(function+()+{++++++++++++
++++++++++++if+($(this).prop('checked')+==+true)+{
++++++++++++++++console.log("checked");+++++++++++
++++++++++++}
++++++++++++else+{
++++++++++++++++console.log("unchecked");++++++++++++++++
++++++++++++}
++++++++});
++++});|code-block|syntax|javascript|4874894|它在checkboxes和radioboxes上也工作得很好。|offset|length|style|CODE|4874895|entityMap^0|0|0|2|A|D|A|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@$I|R|J|S|K|L]|$I|T|J|U|K|L]]|9|@]|A|$]]|$1|M|3|-4|5|6|7|V|8|@]|9|@]|A|$]]]|N|$]]

<p>In case if you need to use CSS class as jQuery selector you can do following:</p>

<pre><code>$(document).ready(function () {
        $('.myOptionCheckbox').change(function () {            
            if ($(this).prop('checked') == true) {
                console.log("checked");           
            }
            else {
                console.log("unchecked");                
            }
        });
    });
</code></pre>

<p>It works fine for <code>checkboxes</code> and <code>radioboxes</code> as well.</p>


blocks|key|4875015|text|此函数是可选的且稳定的：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4875016|$('#isAgeSelected').context.checked
(return+True/False)|code-block|syntax|javascript|4875017|示例：|offset|length|style|BOLD|4875018|if($('#isAgeSelected').context.checked){+//if+Checkbox+is+checked+then+bla+bla..
++++/*.....*/
}else{
++++/*.....*/
}|4875019|entityMap^0|0|0|0|3|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|S|8|@$I|T|J|U|K|L]]|9|@]|A|$]]|$1|M|3|N|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

<p>This function is alternative and stable:</p>

<pre><code>$('#isAgeSelected').context.checked
(return True/False)
</code></pre>

<p><strong><em>Example:</em></strong> </p>

<pre><code>if($('#isAgeSelected').context.checked){ //if Checkbox is checked then bla bla..
    /*.....*/
}else{
    /*.....*/
}
</code></pre>


blocks|key|4029784|text|$('#chk').change(function()+{+
++++(this.checked)?+alert('true')+:+alert('false');
});



($('#chk')[0].checked)?+alert('true')+:+alert('false');|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|4029785|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>$('#chk').change(function() { 
    (this.checked)? alert('true') : alert('false');
});



($('#chk')[0].checked)? alert('true') : alert('false');
</code></pre>


blocks|key|1271836|text|if($('#isAgeSelected').prop('checked'))+{
++++//+do+your+action+
}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1271837|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>if($('#isAgeSelected').prop('checked')) {
    // do your action 
}
</code></pre>


blocks|key|4029652|text|$("#isAgeSelected").prop('checked',+true);|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4029653|entityMap^0|0|16|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|K|8|@]|D|@]|E|$]]]|G|$]]

<p><code>$("#isAgeSelected").prop('checked', true);</code></p>


<p>I need to check the <code>checked</code> property of a checkbox and perform an action based on the checked property using jQuery.</p>
<p>For example, if the <code>age</code> checkbox is checked, then I need to show a textbox to enter <code>age</code>, else hide the textbox.</p>
<p>But the following code returns <code>false</code> by default:</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>if ($('#isAgeSelected').attr('checked')) {
  $("#txtAge").show();
} else {
  $("#txtAge").hide();
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;input type="checkbox" id="isAgeSelected"/&gt;
&lt;div id="txtAge" style="display:none"&gt;
  Age is selected
&lt;/div&gt;</code></pre>
</div>
</div>
</p>
<p>How do I successfully query the <code>checked</code> property?</p>


How do I check whether a checkbox is checked in jQuery?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

我需要检查checkbox的checked属性，并使用jQuery基于checked属性执行操作。例如，如果选中了age复选框，则我需要显示一个文本框以输入age，否则隐藏该文本框。但默认情况下，以下代码返回false：​if ($('#isAgeSelected').attr('checked')) {  $("#txtAge").show();} else {  $("#txtAge").hi

问如何在jQuery中检查复选框是否已选中？
EN

回答 67

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在jQuery中检查复选框是否已选中？EN

回答 67

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在jQuery中检查复选框是否已选中？
EN