这些复选框默认情况下处于选中状态。如果未选中,则应隐藏文本。如何在jquery中隐藏或显示文本?
的HTML:
<div class="check">
<p><input type="checkbox" value="Name" id="name" checked /> <label for="name">Name</label></p>
<p><input type="checkbox" value="Reference " id="reference" checked /> <label for="reference">Reference</label></p>
</div>
<div id="nametxt"> Show Name TEXT </div>
<div id="reftxt"> Show Ref TEXT </div>
最佳答案
将<div id="reftxt">
的ID更改为<div id="referencetxt">
,然后可以执行以下操作:
$('div.check input:checkbox').bind('change',function(){
$('#'+this.id+'txt').toggle($(this).is(':checked'));
});
如果单击了更改事件,或者如果有人使用键盘来选中/取消选中复选框,则将触发更改事件。
只要文本div的
ID
始终为checkbox ID + 'txt'
且位于div.check
中,则这也将处理这些内容。当您获得更多复选框时,无需重复自己。